標準のいいね、ツイート、ピンなどを少し見栄えよくするために、いくつかの共有ボタンを作成しました。私が抱えている問題を示すために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();
});
});
作業用フィドルはこちら