读书人

JS图片点击后取得链接把链接传给大图

发布时间: 2012-06-01 16:46:36 作者: rapoo

JS图片点击后取得链接,把链接传给大图,求代码
大图

<div id="bigimg">
<a href=""><img src="imaegs/1.jpg" width="533" height="800" id="bigimg"/></a>
</div>
小图
<ul id="littleimg">
<li><a href=""><img src="imaegs/1.JPG" width="150" height="150" onclick="img()"/></a></li>
<li><a href=""><img src="imaegs/2.JPG" width="150" height="150" onclick="img()"/></a></li>
<li><a href=""><img src="imaegs/3.JPG" width="150" height="150" onclick="img()"/></a></li>
<li><a href=""><img src="imaegs/4.JPG" width="150" height="150" onclick="img()"/></a></li>
<li><a href=""><img src="imaegs/5.JPG" width="150" height="150" onclick="img()"/></a></li>
</ul>
想实现,在点击小图后,取得这个小图的链接(如imaegs/2.JPG),把这个链接传给大图的src,
就是想实现点击小图大图相应地改变,

[解决办法]
是不是类似于这种效果?
http://qingxinxz.tk/newindex/webwork/imag/

[解决办法]

JScript code
window.onload = function() {    var obj = document.getElementById('littleimg').getElementsByTagName('img');    for (var i = 0; i < obj.length; i ++) {        obj[i].onclick = function() {            document.getElementById('bigimg').src = this.src;        }    }}
[解决办法]
jquery方法:
$('#littleimg li a img').click(function(){
var href=$(this).attr('src');
$('#bigimg a img').attr('src',href);


});

读书人网 >JavaScript

热点推荐