0

私はdivボックスを持っています。ユーザーがホバーするか、マウス入力すると次のdivが表示され、ユーザーがマウスアウトすると表示されるdivがフェードアウトする必要があります。私の機能が正しく動作していません。

<head>    
<script type="text/javascript" src="jquery-1.7.2.js"></script>    
<script type="text/javascript">  

$(function (){      

    $('.box').bind({            
        mouseenter: function (){                
            $(this).next().fadeIn('fast')               
        },          
        mouseout: function (){
            $(this).next().fadeOut('fast')                  
        }


        })      
    })    
</script>    

<style>

body { margin:0}
.box { height:300px; width:300px; background:#F00}

.boxcaption { width:300px; height:300px; background:#00F; position:absolute; left:0; top:0; display:none}
</style>
</head>

<body>

<div class="wrap">

<div class="box"></div>
<div class="boxcaption"></div>

</div>
</body>
4

1 に答える 1

3

2 番目の要素は最初の要素の上にあります。したがって、マウスを入力してからフェードインすると、すぐにマウスアウトが表示されるため、フェードアウトします。2 番目の要素を 300 ピクセル下に移動すると、機能することがわかります。

于 2012-07-16T05:34:00.860 に答える