点击图片缩略图并使用javascript展开到中心 [英] Clicking on a picture thumbnail and expanding to the center with javascript

问题描述

我不知道问这个问题的最佳方式，但我会试一试。

我有3张对应于人物bios的照片的缩略图。我试图让bios列出缩略图，然后让用户能够点击缩略图并将图片展开到屏幕中间。当用户点击图片时，页面将恢复正常。

我相信这里有一个术语，我相信这是一个简单的jQuery方法，但是我无法定位代码来执行此操作。

感谢您的帮助！

瑞恩

解决方案

这个术语是一个灯箱。有许多 jQuery灯箱插件。我在 FancyBox 中有过很棒的经验。

使用他们可以定位所有具有直接子元素的定位标记，例如： $ b

  $（ '一个：具有（IMG）'）的fancybox（）; 
  

I don't know the best way to ask this, but I will give it a try.

I have thumbnails of 3 photos corresponding to peoples bios. I am trying to have the thumbnails listed by the bios then give the user the ability to click a thumbnail and have the picture expand to the middle of the screen. When the user clicks off of the picture, the page returns to normal.

I am sure there is a term for this and I am sure it is an easy jQuery method, but I am having trouble locating the code to do so.

Thanks for any help!

Ryan

解决方案

The term is a lightbox. There any many jQuery lightbox plugins. I've had great experience with FancyBox.

To use them, you could target all anchor tags which have direct children img tags, for instance:

$('a:has(img)').fancybox();

这篇关于点击图片缩略图并使用javascript展开到中心的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！