0

これが私が自分の仕事をしているライブサイトですこれで、そのリンクに、と呼ばれる1つのセクションがありSource from Top Global Suppliers、そのセクションにと呼ばれるブロックがあることがわかりますHot Regions。これで、マウスをホバーすると、いくつかの国の旗が付いたブロックが表示されていることがわかりますが、マウスを旗の1つに移動すると、ボックスが非表示になります。それらのフラグのいずれかがまだボックスがそこにあります。私はそのホバーセクションのためにこのサイトをフォローしました。

そのブロックのjQueryコードは次のようになります

jQuery(document).ready(function() {
    jQuery('.hr-current').mouseover(function() {
      jQuery('#hot-regions').addClass('hr-hover');
    });
    jQuery('.hr-current').mouseout(function() {
      jQuery('#hot-regions').removeClass('hr-hover');
    });
  });

ノート

これがフィドルのリンクですここにフィドルのリンクがありますhttp://jsfiddle.net/NewUserFiddle/y53WQ/ 結果が参照されたリンクとまったく同じになるようにしたい...

4

4 に答える 4

1

mouseoutあなたは:にする必要があり#hot-regionsます

jQuery('#hot-regions').mouseout(function() {
    jQuery(this).removeClass('hr-hover');
});

mouseover/mouseoutの代わりにmouseenter/mouseleaveを使用して修正した場合:

 jQuery(document).ready(function() {

    jQuery('.hr-current').mouseenter(function() {
      jQuery('#hot-regions').addClass('hr-hover');
    });

    jQuery('#hot-regions').mouseleave(function() {
      jQuery(this).removeClass('hr-hover');
    });

  });  

更新されたフィドルを参照してください。

于 2013-03-09T12:13:00.960 に答える
0

ライブデモ

jQuery(document).ready(function() {
    jQuery('#hot-regions').mouseenter(function() {
         jQuery(this).addClass('hr-hover');
    });
    jQuery('#hot-regions').mouseleave(function() {
         jQuery(this).removeClass('hr-hover');
    });
});  
于 2013-03-09T14:00:21.290 に答える
0

いくつかのこと...

まず、.mouseenter()and.mouseleave()ではなく.mouseover()andを使用し.mouseout()ます。

次に、jsfiddleの例から以下を削除します。

CSS:

.hr-hover .hr-current {
    margin-top: 0;
}

最後に、以下を使用します。

JAVASCRIPT:

jQuery(document).ready(function() {
    jQuery('.hr-current').mouseenter(function() {
      jQuery('#hot-regions').addClass('hr-hover');
    });
    jQuery('#hot-regions').mouseleave(function() {
      jQuery('#hot-regions').removeClass('hr-hover');
    });
  });  

デモ:http: //jsfiddle.net/y53WQ/10/

これがお役に立てば幸いです。ご不明な点がありましたらお知らせください。

于 2013-03-12T18:27:43.017 に答える
-1

あなたはそのようなものを使用することができ、イベントを発生させ、追加thisおよびthat削除するために必要なdivです

         $(".ht-current").hover( 
            function(){ 
             $("#hot-regions").addClass('yourHover');
            },
            function(){
             $("#hot-regions").removeClass('yourHover');
            });
于 2013-03-09T12:45:14.353 に答える