0

私のプロジェクトでは、トグル機能が複数回トグルします。フェードインする絶対位置のdivが原因だと思います。私はそれを解決することはできません...

ここでjQueryコード：

var $j = jQuery.noConflict();

$j(document).ready(function(){
$j('.grit_1_3_1').hover(
    function(){$j('.grit_1_3_1_hover').fadeIn()}, 
    function(){$j('.grit_1_3_1_hover').fadeOut()}
);
});

div の css は次のとおりです。

.grit_1_3_1 {
color: #ffffff;
width: 33%;
float: left;
background: #bdbdbd;
vertical-align: center;
text-align: center;
height: 296px;
margin-bottom: 30px;
}
.grit_1_3_1_hover {
    color: #ffffff;
    position: absolute;
    width: 296px;
    display: none;

    float: left;
    background: #bdbdbd;
    vertical-align: center;
    text-align: center;
    height: 296px;
    margin-bottom: 30px;
}

3 つのティーザーのうち最初の 1 つが切り替わるはずですが、止まりません!

ご協力いただきありがとうございます！

よろしくお願いします

4

2 に答える 2

1 
$j(document).ready(function() {
    $j('.grit_1_3_1').hover(function() {
        $j('.grit_1_3_1_hover').stop.fadeTo(1);
    }, function() {
        $j('.grit_1_3_1_hover').stop().fadeTo(0);
    });
});​

編集、

実際、あなたの HTML/CSS もマウスオーバー時に正しくないので.grit_1_3_1、.grit_1_3_1_hover完全に重なってい.grit_1_3_1ます。したがって、これはマウスがオフに.grit_1_3_1なり、フェードアウトすることを意味します。

表示/非表示の代わりにgrit_1_3_1_hover、子レベルで 2 つの div を作成し、コードを次のように変更することをお勧めgrit_contentしgrit_content_hoverます

$j(document).ready(function() {
    $j('.grit_1_3_1').hover(function() {
        $j('.grit_content_hover', $(this)).stop.fadeTo(1);
    }, function() {
        $j('.grit_content_hover', $(this)).stop.fadeTo(0);
    });
});​
于 2012-11-18T21:55:13.993 に答える
0

div を使用すると、画面上の元の画面が置き換えられ.fadeIn()、マウスがそこから離れ、呼び出しの 2 番目の部分がトリガーされます。_hover<div><div>.hover()

div を交換するよりも、それらの div のテキストコンテンツを交換する方が簡単な場合があります。

または、 2 つの交互の div の上にabsolute配置されたオーバーレイを使用します。その<div>divがアクションを処理するようにしますが、その下に必要な div が表示されるようにします。hover

于 2012-11-18T22:02:59.163 に答える