0

動作していないように見えるjqueryコードがいくつかあります...

画像にカーソルを合わせたときにタイトルを表示したいのですが、表示されません。

デモをご覧ください http://jsfiddle.net/3Raar/4/

$(".social-popup-btn").hover(function(){
        $(".social-name-popup").show();
    }, function(){
        $(".social-name-popup").hide();
    })

どんな助けでも素晴らしいでしょう！

4

2 に答える 2

0

あなたのマークアップはやや無効です。これを試して：

<ul class="social-signin-livfeed">
    <li>
        <a href="#" class="facebook-tab-signin social-popup-btn">Facebook</a>
        <p class="social-name-popup">Facebook</p>
    </li>
    <li>
        <a href="#" class="twitter-tab-signin social-popup-btn">Twitter</a>
        <p class="social-name-popup">Twitter</p>
    </li>
    <li>
        <a href="#" class="instagram-tab-signin social-popup-btn">Instagram</a>
        <p class="social-name-popup">Instagram</p>
    </li>
    <li>
        <a href="#" class="google-tab-signin social-popup-btn">G+</a>
        <p class="social-name-popup">Tumbler</p>
    </li>
    <li>
        <a href="#" class="pinterest-tab-signin social-popup-btn">pinterest</a>
        <p class="social-name-popup">Pinterest</p>
    </li>
    <li>
        <a href="#" class="youtube-tab-signin social-popup-btn">Youtube</a>
        <p class="social-name-popup">Youtube</p>
    </li>
    <li class="last">
        <a href="#" class="chartego-tab-signin social-popup-btn">Chartego</a>
        <p class="social-name-popup">Chartego</p>
    </li>
</ul>

と：

$(function(){
    $(".social-name-popup").hide();

    $(".social-popup-btn").hover(function(){
        $(this).siblings(".social-name-popup").show();
    }, function(){
        $(this).siblings(".social-name-popup").hide();
    });
});
于 2013-09-18T17:17:07.950 に答える
0

HTML リスト項目要素 ( <li>) は、リスト項目を表すために使用されます。<ol>これは、順序付きリスト ( )、順序なしリスト ( <ul>)、またはメニュー ( )に含まれている必要があり<menu>、そのリスト内の単一のエンティティを表します。

- Mozilla 開発者ネットワーク

HTML を有効にするために書き直すことをお勧めしますが、これにアプローチする最善の方法は、単にカスタム ツールチップ プラグインを使用することです。jQueryUI の Tooltipを使用することをお勧めします。title次に、各 の属性を変更するだけです<a>。

これを実装する方法は次のとおりです。

DEMO

ジャバスクリプト:

$(function(){
    $(document).tooltip();
});

HTML:

<ul class="social-signin-livfeed">
    <li> 
        <a href="#" class="facebook-tab-signin social-popup-btn" title="Facebook">Facebook</a>
    </li>
    <li> 
         <a href="#" class="twitter-tab-signin social-popup-btn" title="Twitter">Twitter</a>
    </li>
    <li> 
         <a href="#" class="instagram-tab-signin social-popup-btn" title="Instagram">Instagram</a>
    </li>
    <li> 
         <a href="#" class="google-tab-signin social-popup-btn" title="G+">G+</a>
    </li>
    <li> 
         <a href="#" class="pinterest-tab-signin social-popup-btn" title="pininterest">pinterest</a>
    </li>
    <li> 
         <a href="#" class="youtube-tab-signin social-popup-btn" title="Youtube">Youtube</a>
    </li>
    <li class="last">
         <a href="#" class="chartego-tab-signin social-popup-btn" title="Chartego">Chartego</a>
    </li>
</ul>

ご不明な点がございましたら、お気軽にお問い合わせください。

于 2013-09-18T17:10:05.263 に答える