使用lightbox插件有什么效果

这篇文章主要讲解了“使用lightbox插件有什么效果”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“使用lightbox插件有什么效果”吧！

　　slick-lightbox.js是一款基于slick.js和jquery的响应式弹出层lightbox插件。该jquerylightbox插件支持图片懒加载，支持键盘交互，支持html5HistoryAPI等。功能非常强大。

　　Lightbox的效果

　　Lightbox的效果类似于WinXP操作系统的注销/关机对话框，除去屏幕中心位置的对话框，其他的区域都以淡出的效果逐渐变为银灰色以增加对比度，此时除了对话框内的表单控件，没有其他区域可以获取焦点。

　　Lightbox的作用则相当于从前只在IE中被支持的"ModalDialog"；现在在FireFox也可用window.open(url,name,"modal=yes");

　　来实现同样的效果。使用"ModalDialog"将限制用户的操作于弹出的对话框中，只有完成设定好的操作后方才关闭。在一些逻辑敏感的应用中强制吸引用户的注意力以防止用户的误操作导致程序逻辑淆乱。

　　其实Lightbox并不新鲜，在前年Ajax未诞生之前，它是以"InlinePopup"的名号出现的。诞生的原因是因为屏蔽弹出窗口的技术纷纷被浏览器采用，而浏览器厂商间也没有一个统一的Popup解决方案。当时我记得还有一些说"InlinePopup"破解了弹出窗口屏蔽的报道。

　　Lightbox的由来

　　"InlinePopup"并不被很多人关注，不过我还是发现国内的163信箱改版推出的时候大量使用了此效果。Ajax名正言顺之时，"InlinePopup"也重装再现了，并换了一个有美感的名字"Lightbox"。

　　LightboxJS最早被其作者LokeshDhakar用来放大显示图片覆盖于当前页面之上，其是用CSS来定义图片容器，用一幅半透明的png图片实现渐变阴暗的效果。使用相当简单：

　　1.加载lightbox.js

　　2.给图片链接增加一个rel="lightbox"属性。如：

　　<ahref="images/image-1.jpg"rel="lightbox"title="mycaption">image#1</a>

感谢各位的阅读，以上就是“使用lightbox插件有什么效果”的内容了，经过本文的学习后，相信大家对使用lightbox插件有什么效果这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是亿速云，小编将为大家推送更多相关知识点的文章，欢迎关注！