我有一个网站,上面有一张图片。我想要的:如果我点击图片,我想在这个窗口内打开一个窗口。我经常看到图像,我希望以更大的尺寸显示。
我在网站上有一个缩略图,然后通过点击它,背景将变为灰色,图像将在网站顶部的图层中以大图像打开。
我想要同样的,如果可以使用jQuery,我想显示更大的图像和一些文本。如何用jQuery完成?
最诚挚的问候。
答案 0 :(得分:3)
您要做的是创建一个modal dialog
,它通常只是一个具有相应CSS的容器,使其位于页面上其他HTML的顶部。
有数百个jQuery插件可以做到这一点。这是一篇描述其中19个的文章:
19 jQuery Modal Boxes to Improve your UI - 2009年11月1日
jQuery Modal Box Round Up - 2009年3月16日
Top 10 jQuery Modal Box Plugins - 2009年12月29日
2009年,“我首选的模态对话框”博客发布的年份
我曾经使用过并喜欢:
答案 1 :(得分:1)
答案 2 :(得分:1)
您正在寻找jquery lightBox plugin。
使用它的一些方法如下:
<script type="text/javascript">
$(function() {
// Use this example, or...
$('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
// This, or...
$('#gallery a').lightBox(); // Select all links in object with gallery ID
// This, or...
$('a.lightbox').lightBox(); // Select all links with lightbox class
// This, or...
$('a').lightBox(); // Select all links in the page
// ... The possibility are many. Use your creative or choose one in the examples above
});
</script>
有关更多信息,请访问上面的链接。
替代方案是prettyPhoto或photo gallery的任何jquery插件。
答案 3 :(得分:1)
是的,试试一个简单的解决方案:Fancybox!享受,我相信这将对您的网站有所了解,并且易于集成!是的,这需要jQuery,并且具有比原生jQuery灯箱组件更好的功能。
答案 4 :(得分:1)
你可以使用http://leandrovieira.com/projects/jquery/lightbox/,它是jQuery插件
答案 5 :(得分:1)
您正在寻找类似ThickBox plugin的内容。转到链接,然后单击“示例”,然后单击“演示”。
还有LightBox是另一种jQuery插件。