jquery图片选择器

时间:2011-08-18 13:01:07

标签: javascript jquery image photo

有没有人有一个基于jquery的照片选择器的例子?这是你在小相册中看到的。

我有以下代码:

<div><img class="bigpicture" src="1.jpg"></img></div>
<div>
    <img class="smallpicture" src="1.jpg"></img>
    <img class="smallpicture" src="2.jpg"></img>
    <img class="smallpicture" src="3.jpg"></img>
    <img class="smallpicture" src="4.jpg"></img>
    <img class="smallpicture" src="5.jpg"></img>
    <img class="smallpicture" src="6.jpg"></img>
</div>

我正在寻找的行为是当用户将鼠标悬停在任何较小的图片上时,它会用刚刚悬停的图片更新整个图片。

有什么想法吗?

由于

3 个答案:

答案 0 :(得分:4)

$('.smallpicture').hover(function(){
   $('.bigpicture').attr('src', $(this).attr('src')+"?timestamp=" + new Date().getTime());
});

timestamp需要动态更新您的大图片。

答案 1 :(得分:2)

$('.smallpicture').hover(function(){
    var theSrc = $(this).attr('src');
    $('.bigpicture').attr('src', theSrc);
});

答案 2 :(得分:1)

使用jQuery:

$('.smallpicture').hover(function() {
    $('.bigpicture').attr('src', $(this).attr('src'));
});