我如何制作缩略图< img>单击时显示完整大小的图像？ [英] How can I make a thumbnail <img> show a full size image when clicked?

问题描述

通常情况下，您将 src 作为图片来源，而 alt 作为替代文字：

 < img src =image1.gifalt =图片1/> 
  

您可以拥有类似的东西吗？：

 < img src =image1.gifalt =image2.gif/> 
  

这意味着 src 有一个图片来源，

我想要做的就是使用flickr api（一张拇指图片和一张正常大小的图片）从flickr中拉出2张图片），当用户点击拇指时，会显示正常尺寸的图片。

我试过这样的事情：

 < a href =image2.gif>< img src =image1.gif/>< / a> 
  

...但我得到了默认的' not found '图像作为大拇指（尽管图像确实存在）。

我正在使用JQuery / Javascript 。

任何帮助，建议或甚至替代品都是受欢迎和赞赏的。

谢谢

---

感谢Sam的回复，

我不喜欢lightbox，因为我发现它太慢和看中。

但我喜欢 geowa4 的想法。

但是，请保留您的答案...
$ b

谢谢

$

 < a href = image2.gif>< img src =image1.gif/>< / a> 
  

技术一直适用于我。我在超级杯日记中使用它的效果很好，但是我看到我使用的脚本已损坏。一旦我解决了问题，我将在URL中进行编辑。

Normally you have an image tage with the src as the source of the image and the alt as the alternative text:

<img src="image1.gif" alt="Image 1" />

Can you have something like is?:

<img src="image1.gif" alt="image2.gif" />

So that means the src has an image source and the alt also has an image source.

What I want to do is pull 2 images from flickr using the flickr api (a thumb image and a normal sized image) and when the user clicks on the thumb, the normal sized image is shown.

I have tried something like this:

<a href="image2.gif" ><img src="image1.gif"/></a>

...but I get the default 'not found' image as the thumb (even though the image does really exist).

I am using JQuery/ Javascript.

Any help, suggestions or even alternatives are all welcome and appreciated.

Thanks

---

Thanks for the reply Sam,

I don't like lightbox because I find it too slow and fancy.

but I like geowa4's idea.

but please, keep your answers coming...

thanks

解决方案

The

<a href="image2.gif" ><img src="image1.gif"/></a>

technique has always worked for me. I used it to good effect in my Super Bowl diary, but I see that the scripts I used are broken. Once I get them fixed I will edit in the URL.

这篇关于我如何制作缩略图< img>单击时显示完整大小的图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！