0

私は周りを見回し、基本的にJquery APIページに住んでいましたが、特定のホバーイベントを発生させる方法を理解できないようです.

私が持っているもの：

<div class="profile profile-inner">
<div class="profile-footer">
<ul class="profile-actions">

私が欲しいもの：

ul クラスは非表示です。次に、div クラス「profile profile-inner」がホバーされると、ul クラスが表示されるようにします。

ノート：

私の知る限り、this多くの div クラスがあるprofile profile-innerため (その特定のページに多くの異なるメンバーのプロファイルがあるため) 、使用する必要があります。

4

3 に答える 3

3

.hover()2つの引数を取ります。「ホバー状態」に移行するときに呼び出す関数と、「ホバー状態」を離れるときに呼び出す関数です。

$('.profile.profile-inner').find('ul').hide();
$('.profile.profile-inner').hover(function() {
  $(this).find('ul').show();
}, function() {
  $(this).find('ul').hide();
});

これを行うことはお勧めしません。ページのレイアウトによっては、Javascriptでホバーを検出することは信頼できず、状態が「スタック」する可能性があります。これはユーザーを苛立たせる可能性があり、幸いなことに、CSSを単独で使用して必要なことを実行できます。

.profile.profile-inner ul { display: none; }
.profile.profile-inner:hover ul { display: block; }

外部要素が<a>タグの場合、これはMSIE6でも機能します。

さらに下位互換性が必要な場合は、jQueryのホバーを使用する代わりに、CSSベースのメソッドを補完する動作-shimを作成することをお勧めします。この方法は、MSIE4までさかのぼって機能します。

于 2012-10-07T20:06:45.147 に答える
0

これには JavaScript (または jQuery) は必要ありません。css を使用するだけです。

profile-inner:hover .profile-actions{ display:block; }

ライブデモ

于 2012-10-07T20:20:29.153 に答える
0 
 $(document).ready(function()
 {
    $(".profile-actions").hide();

    $(".profile-inner").hover(function()
    {
        $(".profile-actions").show();   
    }, function()
        {
          $(".profile-actions").hide();
        });     
});

仕事をすべき

于 2012-10-07T20:11:00.973 に答える