资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
图片连续不间断滚动像册
<!--Quirks Mode--> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type"content="text/html; charset=utf-8" /> <title>Fifty Studio│图片连续不间断滚动像册</title> <link rel="stylesheet" type="text/css" href="/tutorials/demo/css/main.css" /> <!--[if IE]><style> @import url("/tutorials/demo/css/ie.css"); </style><![endif]--> <style type="text/css"> <!-- /*--CSS Code by Forestgan http://www.forest53.com--*/ a{background:#EEE; color:#333;} a:hover{background:#EEE;color: #666;} #demo ul{list-style:none;} #FGWrapper{width: 640px; margin:2em auto; background:#EEE;} #FGLeft{float: left;padding: 10px;} #FGThumb{float: right;padding: 10px 10px 10px 0;background:#EEE;} #demo{overflow:hidden; width: 130px;height: 360px; background:#eee;} #demo img {border: 0;margin-bottom: 10px;vertical-align: middle;} #FGFooter{ font-size: 1em; padding:0 10px 10px; clear:both;text-align:right;} span#FGdesc2{float: left;} --> </style> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0Afunction%20showPic%20(whichpic)%20%7B%20%20%20%20%20%20%0D%0A%20%20%20%20if%20(document.getElementById)%20%7B%20%20%20%20%20%20%20%20%20%20%0D%0A%20%20%20%20document.getElementById('FGplaceholder').src%20%3D%20whichpic.href%3B%20%0D%0A%20%20%20%20if%20(whichpic.title)%20%20%0D%0A%20%20%20%20%7Bdocument.getElementById('FGdesc2').childNodes%5B0%5D.nodeValue%20%3D%20whichpic.title%3B%20%7D%20%20%0D%0A%20%20%20%20else%20%7Bdocument.getElementById('FGdesc2').childNodes%5B0%5D.nodeValue%20%3D%20whichpic.childNodes%5B0%5D.nodeValue%3B%20%7D%20%20%0D%0A%20%20%20%20%20%20%20return%20false%3B%20%20%20%20%20%20%0D%0A%20%20%20%20%7D%20%20%0D%0A%20%20%20%20%20%20else%20%7B%20return%20true%3B%20%7D%20%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__noscript" _ewebeditor_fake_tag="noscript" _ewebeditor_fake_value="%3Cnoscript%3E%20%0D%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%20%0D%0A%23demo%7Boverflow%3Aauto%3B%20%7D%20%0D%0A%7D%20%0D%0A%3C%2Fstyle%3E%20%0D%0A%3C%2Fnoscript%3E"> </head> <body> <div id="ForestganWrap"> <div id="forestganHeader"> <a href="/" _ewebeditor_ta_href="%2F"><img src="/img/logo.gif" _ewebeditor_ta_src="%2Fimg%2Flogo.gif" width="170" height="40" alt="Fifty Studio" class="logo" /></a> <h1>CSS 布局演示 CSS Layout by Forestgan</h1> <h2 id="demo_date">2006-10-30 发表</h2> </div> <div id="forestganMiddle"> <div id="FGWrapper"> <div id="FGLeft"><img width="480" height="360" src="http://files.glzy8.com/upload/bigimg/holiday102801.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fbigimg%2Fholiday102801.jpg" alt="" id="FGplaceholder" /> </div> <div id="FGThumb"> <div id="demo"> <div id="demo1"> <ul> <li><a href="/upload/bigimg/holiday102801.jpg" _ewebeditor_ta_href="%2Fupload%2Fbigimg%2Fholiday102801.jpg" onclick="return showPic(this);" title="My Photo 1"><img width="130" height="80" src="http://files.glzy8.com/upload/thumb/holiday102801s.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fthumb%2Fholiday102801s.jpg" alt="" /></a> </li> <li><a href="/upload/bigimg/holiday102802.jpg" _ewebeditor_ta_href="%2Fupload%2Fbigimg%2Fholiday102802.jpg" onclick="return showPic(this);" title="My Photo 2"><img width="130" height="80" src="http://files.glzy8.com/upload/thumb/holiday102802s.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fthumb%2Fholiday102802s.jpg" alt="" /></a> </li> <li><a href="/upload/bigimg/holiday102806.jpg" _ewebeditor_ta_href="%2Fupload%2Fbigimg%2Fholiday102806.jpg" onclick="return showPic(this);" title="My Photo 3"><img width="130" height="80" src="http://files.glzy8.com/upload/thumb/holiday102806s.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fthumb%2Fholiday102806s.jpg" alt="" /></a> </li> <li><a href="/upload/bigimg/holiday102809.jpg" _ewebeditor_ta_href="%2Fupload%2Fbigimg%2Fholiday102809.jpg" onclick="return showPic(this);" title="My Photo 4"><img width="130" height="80" src="http://files.glzy8.com/upload/thumb/holiday102809s.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fthumb%2Fholiday102809s.jpg" alt="" /></a> </li> <li><a href="/upload/bigimg/holiday102810.jpg" _ewebeditor_ta_href="%2Fupload%2Fbigimg%2Fholiday102810.jpg" onclick="return showPic(this);" title="My Photo 5"><img width="130" height="80" src="http://files.glzy8.com/upload/thumb/holiday102810s.jpg" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2Fthumb%2Fholiday102810s.jpg" alt="" /></a> </li> </ul> </div> <div id="demo2"> </div> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A%20%20%20%20%2F%2F%E5%9B%BE%E7%89%87%E6%97%A0%E9%97%B4%E6%96%AD%E6%BB%9A%E5%8A%A8%E4%BB%A3%E7%A0%81%EF%BC%8C%E5%85%BC%E5%AE%B9IE%E3%80%81Firefox%E3%80%81Opera%20%0D%0A%20%20%20%20%2F%2F%E5%8E%9F%E8%84%9A%E6%9C%AC%E6%98%AFIE%20only%EF%BC%8C%E6%9D%A5%E8%87%AA%E7%BD%91%E4%B8%8A%EF%BC%8C%E4%BD%9C%E8%80%85%E6%9C%AA%E7%9F%A5%20%0D%0A%20%20%20%20%2F%2F%E9%83%A8%E5%88%86%E5%86%85%E5%AE%B9%E6%98%AF%E7%94%B1forestgan%E4%B8%BA%E4%BA%86JS%E4%BB%A3%E7%A0%81%E6%A0%87%E5%87%86%E5%8C%96%EF%BC%8C%E5%85%BC%E5%AE%B9%E4%BB%A5gecko%E4%B8%BA%E5%86%85%E6%A0%B8%E7%9A%84%E6%B5%8F%E8%A7%88%E5%99%A8%E4%BA%8E2006-10-30%E9%87%8D%E5%86%99%20%0D%0A%20%20%20%20%2F%2Fhttp%3A%2F%2Fwww.forest53.com%20%0D%0A%20%20%20%20%20%0D%0A%20%20%20%20var%20speed%3D30%3B%20%0D%0A%20%20%20%20var%20FGDemo%3Ddocument.getElementById('demo')%3B%20%0D%0A%20%20%20%20var%20FGDemo1%3Ddocument.getElementById('demo1')%3B%20%0D%0A%20%20%20%20var%20FGDemo2%3Ddocument.getElementById('demo2')%3B%20%0D%0A%20%20%20%20FGDemo2.innerHTML%3DFGDemo1.innerHTML%20%0D%0A%20%20%20%20function%20Marquee1()%7B%20%0D%0A%20%20%20%20if(FGDemo2.offsetHeight-FGDemo.scrollTop%3C%3D0)%20%0D%0A%20%20%20%20FGDemo.scrollTop-%3DFGDemo1.offsetHeight%20%0D%0A%20%20%20%20else%7B%20%0D%0A%20%20%20%20FGDemo.scrollTop%2B%2B%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20var%20MyMar1%3DsetInterval(Marquee1%2Cspeed)%20%0D%0A%20%20%20%20FGDemo.onmouseover%3Dfunction()%20%7BclearInterval(MyMar1)%7D%20%0D%0A%20%20%20%20FGDemo.onmouseout%3Dfunction()%20%7BMyMar1%3DsetInterval(Marquee1%2Cspeed)%7D%20%0D%0A%3C%2Fscript%3E"> </div> <div id="FGFooter"><span id="FGdesc2">My Photo 1</span><a href="http://www.forest53.com" _ewebeditor_ta_href="http%3A%2F%2Fwww.forest53.com">Design by Forestgan</a></div> </div> </div> </div> <div id="forestganFooter"> <address> 演示页面设计制作： <a href="http://www.forest53.com" _ewebeditor_ta_href="http%3A%2F%2Fwww.forest53.com">Forestgan</a> 采用<a href="http://www.creativecommons.cn/" _ewebeditor_ta_href="http%3A%2F%2Fwww.creativecommons.cn%2F">创作共用授权</a>--署名和非商业用途 <a href="javascript:history.back()" _ewebeditor_ta_href="javascript%3Ahistory.back()">返回前一页</a> </address> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20src%3D%22http%3A%2F%2Fwww.google-analytics.com%2Furchin.js%22%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A%3C%2Fscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A_uacct%20%3D%20%22UA-152060-1%22%3B%20%0D%0AurchinTracker()%3B%20%0D%0A%3C%2Fscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__noscript" _ewebeditor_fake_tag="noscript" _ewebeditor_fake_value="%3Cnoscript%3E%20%0D%0A%3Cp%3Egoogle-analytics%3C%2Fp%3E%20%0D%0A%3C%2Fnoscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20src%3D%22%2Fjs%2Fcopyrightdemo.js%22%20type%3D%22text%2Fjavascript%22%3E%3C%2Fscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__noscript" _ewebeditor_fake_tag="noscript" _ewebeditor_fake_value="%3Cnoscript%3E%3Cp%3Emy%20stat%3C%2Fp%3E%3C%2Fnoscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程