Question

我创建了一些共享按钮，试图使标准，如推文，pin等看起来更好一点。我创建了一个jsfiddle来证明我遇到的问题。它们几乎按预期工作，但在悬停时我需要使用跨度来阻止用户单击下面的按钮而无法弄明白。如果你玩小提琴，你会看到我的意思。

我的HTML

<div class="sharebuttons">
    <ul>
        <li id="tweet"><span></span><a href="">tweet</a></li>
        <li id="like"><span></span><a href="">like</a></li>
        <li id="pin"><span></span><a href="">pin</a></li>
        <li id="plusone"><span></span><a href="">plusone</a></li>
    </ul>
</div>

JS：

$(document).ready(function(){
    $('.sharebuttons ul li span').hover(function(){
        $(this).slideUp();
    }, function(){
        $(this).slideDown();
    });
});

工作小提琴在这里

http://jsfiddle.net/bgxZB/

Answer 1

您需要将鼠标悬停在li而不是span：

上

$(document).ready(function(){

    $('.sharebuttons ul li').hover(function(){
        $(this).find('span').slideUp();
    }, function(){
        $(this).find('span').slideDown();
    });

});

<强> Demo

jQuery悬停功能可以滑动跨度

1 个答案: