将下面代码中的transitionshow.js引用和body里面(包括body)的代码复制到侧栏自定义内容小工具,即可。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>随机变换的幻灯片效果</title> <style type="text/css"> .flashclass{ /*sample CSS class added to image slideshow container*/ width: 200px; /*a width should be defined for transition to work*/ border: 5px solid orange; padding: 5px; } .flashclass img{ border-width: 0; } </style> <script type="text/javascript" src="transitionshow.js"> </script> </head> <body> <script type="text/javascript"> var flashyshow=new flashyslideshow({ //create instance of slideshow wrapperid: "myslideshow", //unique ID for this slideshow wrapperclass: "flashclass", //desired CSS class for this slideshow imagearray: [ ["summer.jpg", "http://www.sharejs.com", "_new", "Such a nice Summer getaway."], ["winter.jpg", "http://en.wikipedia.org/wiki/Winter", "", "Winter is nice, as long as there's snow right?"], ["spring.jpg", "", "", "Flowers spring back to life in Spring."], ["autumn.jpg", "", "", "Ah the cool breeze of autumn."] ], pause: 2000, //pause between content change (millisec) transduration: 1000 //duration of transition (affects only IE users) }) </script> </body> </html>
说明:其中这条代码指定了每一个图片路径、链接、目标、描述, 依照这个格式,可以自己添加若干张图片 。
["image_path", "optional_image_link", "optional_link_target", "optional_text_description],
本站文章除注明转载/出处外,均为本站原创或翻译。若要转载但请务必注明出处,尊重他人劳动成果。
转载请注明出处链接 : https://www.inlojv.com/4108.html