我一整天都在寻找解决方案。我尝试做这样的事情:
sigma-topline2012.com/en-us/topline-2012/bc-5-12/overview.html#highlight
正如你所看到的,当我们将鼠标移动到右侧的描述上时,图像就会发生变化。有人可以帮我解决这些问题吗?谢谢!
最佳答案
使用 jQuery hover
<img id="image" src="http://placekitten.com/g/130/130" />
<ul>
<li data-link="http://placekitten.com/g/150/150">Cat 1</li>
<li data-link="http://placekitten.com/g/151/151">Cat 2</li>
<li data-link="http://placekitten.com/g/152/152">Cat 3</li>
</ul>
$(document).ready(function(){
var img = $('#image');
$('li').hover(function(){
img.attr('src', $(this).data('link'));
});
});
只需添加一个 css 类即可淡入/淡出
关于javascript - 当 div 悬停时更改图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29335897/