jQueryの「オブジェクト」の開発に問題があります。div1(下の画像を参照)を(背景画像の使用)の画像を含む背景divにします。次に、div 2(下の画像を参照)にdiv1をオーバーレイします。これを実行できます。しかし、私はjQueryの経験がほとんどないので、それは私が苦労している次の部分です。div 2にカーソルを合わせると、jQuery slideDown()/ slideUp()を使用してdiv 3を表示および非表示にします(下の画像を参照)。また、上にスライドするときに閉じないようにする必要があります(カーソルがdiv 2上にないため)。オブジェクト全体にカーソルを合わせていない場合にのみ、オブジェクトが閉じます。これが理にかなっていることを願っています...どこから始めればいいのかわかりません。さらに情報が必要な場合はお問い合わせください。
1 に答える
3
このような何かが私が信じていることをするはずです、あるいは少なくともそれはあなたに遊んで、さらに改善するための出発点を与えます。
マークアップ
<div class="wrapper">
<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
</div>
CSS
.wrapper {
float: left;
}
.one {
background-color: grey;
width: 100px;
height: 100px;
}
.two {
background-color: blue;
width: 100px;
height: 20px;
}
.three {
background-color: green;
width: 100px;
height: 100px;
display: none;
}
JavaScript
$(function () {
$(".two").mouseenter(function (){
$(".one, .three").slideToggle();
});
$(".wrapper").mouseleave(function (){
$(".one, .three").slideToggle();
});
});
実例: http: //jsfiddle.net/ZHxe5/1/
于 2012-08-19T13:45:16.287 に答える