作家
登录

JavaScript 仿关机效果的图片层

作者: 来源:www.28hudong.com 2013-03-30 02:46:27 阅读 我要评论

首先下载JavaScript包: http://thecodecentral.com/wp-content/uploads/2007/08/yuilightboxwdep.zip <html> <head> //根据下载的JavaScript包修改以下的路径 <link rel="stylesheet" type="text/css" href="js/yui/assets/skins/sam/container.css" /> <script type="text/javascript" src="js/yui/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="js/yui/dragdrop/dragdrop-min.js"></script> <script type="text/javascript" src="js/yui/container/container-min.js"></script> <script type="text/javascript" src="js/lightbox/Lightbox.js"></script> <script type="text/javascript">... //加载 lightbox init = function()...{ //制作一个数据源,含原本图片 //用法: 图片ID: {url: "原本图片路径", title:"标题" } var dataSource = ...{ id_1:...{url:"image-big.jpg", title: '测试图片'} }; //创建 Lightbox 对象: //用法: //imageBase: Lightbox.js 的路径 //dataSource: 数据源 var lightbox = new YAHOO.com.thecodecentral.Lightbox(...{ imageBase:'js/lightbox', dataSource: dataSource }); } //这行保持原貌 YAHOO.util.Event.on(window, 'load', init); </script> </head> <body> //加一个预览图片 //用法:<img src="预览.jpg" id="图片ID"/> //注意:保持图片ID和数据源ID一致 <img src="image-small.jpg" id="id_1"/> </body> </html> 代码无注解: <html> <head> <link rel="stylesheet" type="text/css" href="js/yui/assets/skins/sam/container.css" /> <script type="text/javascript" src="js/yui/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="js/yui/dragdrop/dragdrop-min.js"></script> <script type="text/javascript" src="js/yui/container/container-min.js"></script> <script type="text/javascript" src="js/lightbox/Lightbox.js"></script> <script type="text/javascript"> init = function(){ var dataSource = { id_1:{url:"image-big.jpg", title: '测试图片'} }; var lightbox = new YAHOO.com.thecodecentral.Lightbox({ imageBase:'js/lightbox', dataSource: dataSource }); } YAHOO.util.Event.on(window, 'load', init); </script> </head> <body> <img src="image-small.jpg" id="id_1"/> </body> </html>

  推荐阅读

  javascript 一段代码引发的思考第1/2页

在2008年的最后一天,在此祝愿大家元旦快乐!!! 郑重声明:此问题根本不是问题,现在看来就是本人知识匮乏,庸人自扰,望广大朋友勿喷!! 细心发现问题,耐心解决问题,信心面对问题. 作者:白某人 长话短说:”服务员,上代码>>>详细阅读


本文标题:JavaScript 仿关机效果的图片层

地址:http://www.17bianji.com/kaifa2/JS/29055.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)