0

私はドロップダウンメニューを持っています。私が望むのは、リンクがホバーされたときにドロップダウンメニューの右側に画像を表示することです.すべてのリンクは異なる画像を持つため、リンクがホバーされると画像が自動的に変更されホバー効果はありません。1 つの固定画像に戻る必要があります。

この効果を機能させる方法に関するアイデア

このセクションで:

<div class="menu">
<div class="left-menu-section">
<ul>
<li><a href="#">Product 1</a></li>
<li><a href="#">Product 2</a></li>
<li><a href="#">Product 3</a></li>
<li><a href="#">Product 4</a></li>
</ul>
</div>
<div class="right-menu-image-section">
<img src="" alt=""/>
</div>
</div>

左側のセクションにあるリンクにマウスを置いたときに、右側のセクションに画像を表示したいと考えています。ヘルプや提案をいただければ幸いです。ありがとう

4

1 に答える 1

-1
$img = $(".right-menu-image-section img");

var old_img = $img.attr('src');

$(".left-menu-section li").hover(function(){
    // need to implement some logic for getting new image
    // set new image
    $img.attr(src, new_img);
}, function(){
    // reset the original image
    $img.attr(src, old_img);
});
于 2013-01-08T07:22:27.650 に答える