将悬停时的背景图像更改为每个图片库链接
Posted
技术标签:
【中文标题】将悬停时的背景图像更改为每个图片库链接【英文标题】：Change background image on hover to every image gallery links 【发布时间】：2012-05-26 01:30:35 【问题描述】：当我将鼠标悬停到页面上的每个图像链接时，如何更改页面背景。我想根据页面上的每个图像动态更改页面背景。请查看代码以准确了解我要说的内容。
<script>
$(function()
$("a").hover(function()
var $link = $("img").attr("src");
$("body").css("background", "url(" + $link + ")" );
);
);
</script>
<html>
<body>
<a href="#" title="">
<img src="portfolio_files/NEWSALV.gif" >
</a>
<a href="#" title="">
<img src="portfolio_files/TSThumb.gif" >
</a>
<a href="#" title="">
<img src="portfolio_files/MoreheadThumb.gif" >
</a>
</body>
</html>
请帮助解决这个问题，在此先感谢。
【问题讨论】：
【参考方案1】：使用$("img") 将每次返回文档中的第一个img 元素。每次都需要找到相对于a元素的img元素。
这可以通过使用$(this)和.find()来实现；
<script>
$(function()
$("a").hover(function()
var $link = $(this).find("img").attr("src");
$("body").css("background", "url(" + $link + ")" );
);
);
</script>
【讨论】：
以上是关于将悬停时的背景图像更改为每个图片库链接的主要内容，如果未能解决你的问题，请参考以下文章