0

私はjQueryに慣れてきましたが、コードを何度も繰り返していることに気づきました...

確かにこれを書くためのより簡単な方法があります：

$('#more-mcr, #more-hilton, #more-lpool').hide();


$('#mcr-hatters').hoverIntent(function() {
    $('#mcr-hilton').stop().animate({opacity: 0.4});
    $('#more-mcr').fadeIn({duration:200});
}, function() {
    $('#mcr-hilton').stop().animate({opacity: 1});
    $('#more-mcr').fadeOut({duration:200});
});

$('#mcr-hilton').hoverIntent(function() {
    $('#mcr-hatters').stop().animate({opacity: 0.4});
    $('#more-hilton').fadeIn({duration:200});
}, function() {
    $('#mcr-hatters').stop().animate({opacity: 1});
    $('#more-hilton').fadeOut({duration:200});
});

$('#lpool-hostel').hoverIntent(function() {
    $('#more-lpool').fadeIn({duration:200});
}, function() {
    $('#more-lpool').fadeOut({duration:200});
});

$('#offers-mcr').hoverIntent(function() {
    $('#offers-lpool').stop().animate({opacity: 0.4});
    $('#offers-bham').stop().animate({opacity: 0.4});
}, function() {
    $('#offers-lpool').stop().animate({opacity: 1});
    $('#offers-bham').stop().animate({opacity: 1});
});

$('#offers-lpool').hoverIntent(function() {
    $('#offers-mcr').stop().animate({opacity: 0.4});
    $('#offers-bham').stop().animate({opacity: 0.4});
}, function() {
    $('#offers-mcr').stop().animate({opacity: 1});
    $('#offers-bham').stop().animate({opacity: 1});
});

$('#offers-bham').hoverIntent(function() {
    $('#offers-lpool').stop().animate({opacity: 0.4});
    $('#offers-mcr').stop().animate({opacity: 0.4});
}, function() {
    $('#offers-lpool').stop().animate({opacity: 1});
    $('#offers-mcr').stop().animate({opacity: 1});
});

hoverIntentの遅延も設定したいのですが、現在のコードの記述方法ではこれが不可能だと思います...？

4

2 に答える 2

2

ホバーしたいさまざまなアイテムにクラスを追加しますhoverItem。$('.hoverItem').hoverIntent(function() ...);その後、一度に複数の項目を設定するために使用できます。あなたが与えた例に2つの異なる不透明度が定義されている脂肪を考えると、2つのクラスを作成します。

于 2010-06-03T16:40:16.360 に答える
0

名前付き関数 (関数 myHover() {} など) を作成し、.hoverIntentそれを として参照できます.hoverIntent(myHover)。また、2 つの ID に同じ機能を付加する場合は、 Multiple Selectorの使用を検討してください。

于 2010-06-03T16:41:04.297 に答える