コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > 本文

ホバーの使い方とlive(マウスホバー効果)の使い方の紹介_jquery

WBOY
リリース： 2016-05-16 17:38:55
オリジナル
1464 人が閲覧しました
コードをコピー コードは次のとおりです:

// live は主に、動的に読み込まれるイベントをバインドするために使用されます。 elements
// 製品カタログ
$(".lm_div_q dd").live({
mouseenter: function() {
$(this).find("strong").addClass(" tj_strong ");
$(this).find("strong").next().slideDown(200); // ドロップダウン ボックスを表示
},
mouseleave: function() {
$ (this).find("strong").removeClass("tj_strong");
$(this).find("strong").next().slideUp(200); // ドロップを非表示にする-down box
}
});
//ホバーはイベントを直接バインドします
// 製品カタログ<br>$(".lm_div_q dd")。 hover(function( ){ <br>$(this).find("strong").addClass("tj_strong"); <br>$(this).find("strong").next().stop(true ,true). slideDown(200); // ドロップダウン ボックスを表示します <br>}, function(){ <br>$(this).find("strong").removeClass("tj_strong"); $(this).find ("strong").next().stop(true,true).slideUp(200); // ドロップダウン ボックスを非表示<br>});







関連ラベル：
hover live マウスオーバー
ソース：php.cn
前の記事：js は class_javascript のすべての要素を取得します。 次の記事：jsナビゲーションメニュー(自作)はシンプルでエレガント_基礎知識
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
JavaScript を使用せずにクリック時に画像ソースを動的に変更する CSS のみのメソッド img:active{} のような CSS のみを使用して、マウスクリック時に画像の src を変更する必要があります
から 2024-04-06 19:25:49
0
1
505
CSS スタイルがサイトに適用されない Bootstrap5を使用してWebサイトを作成していますが、index.cssプロパティがindex.htmlに適用されません。サービス カードの上にマウスを移動すると、背景が変...
から 2024-04-06 17:12:23
0
1
336
ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
から 2024-04-06 15:35:24
0
1
274
ナビゲーションバーの下枠のCSS ナビゲーション バーがあり、リスト内の項目にカーソルを置くと下部に赤い線を追加しましたが、その赤い線をタイトル (例: 「サービス」) の下に移動したいのですが、これを実現する方法...
から 2024-04-06 15:04:41
0
2
347
CSS Tailwind を使用した画像ホバー カード アニメーションが期待どおりに動作しません。 <html><body><divclass="groupcardmy-14mx-3w-80h-100bg-gray-800rounded-x...
から 2024-04-06 13:43:17
0
1
356
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート