图片连续不间断滚动像册

更新时间：2007年01月29日 00:00:00 作者：

<!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" />  <style type="text/css">  </style> <script type="text/javascript"> function showPic (whichpic) {          if (document.getElementById) {              document.getElementById('FGplaceholder').src = whichpic.href;     if (whichpic.title)      {document.getElementById('FGdesc2').childNodes[0].nodeValue = whichpic.title; }      else {document.getElementById('FGdesc2').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue; }         return false;          }        else { return true; }  } </script> <noscript> <style type="text/css"> #demo{overflow:auto; } } </style> </noscript> </head> <body> <div id="ForestganWrap">   <div id="forestganHeader"> <a href="/"><img src="/img/logo.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="/upload/bigimg/holiday102801.jpg" alt="" id="FGplaceholder" /> </div> <div id="FGThumb"> <div id="demo"> <div id="demo1"> <ul>     <li><a href="/upload/bigimg/holiday102801.jpg" onclick="return showPic(this);" title="My Photo 1"><img width="130" height="80" src="/upload/thumb/holiday102801s.jpg" alt="" /></a> </li>     <li><a href="/upload/bigimg/holiday102802.jpg" onclick="return showPic(this);" title="My Photo 2"><img width="130" height="80" src="/upload/thumb/holiday102802s.jpg" alt="" /></a> </li>     <li><a href="/upload/bigimg/holiday102806.jpg" onclick="return showPic(this);" title="My Photo 3"><img width="130" height="80" src="/upload/thumb/holiday102806s.jpg" alt="" /></a> </li>     <li><a href="/upload/bigimg/holiday102809.jpg" onclick="return showPic(this);" title="My Photo 4"><img width="130" height="80" src="/upload/thumb/holiday102809s.jpg" alt="" /></a> </li>     <li><a href="/upload/bigimg/holiday102810.jpg" onclick="return showPic(this);" title="My Photo 5"><img width="130" height="80" src="/upload/thumb/holiday102810s.jpg" alt="" /></a> </li> </ul> </div> <div id="demo2">&nbsp;</div> </div> <script type="text/javascript">     //图片无间断滚动代码，兼容IE、Firefox、Opera     //原脚本是IE only，来自网上，作者未知     //部分内容是由forestgan为了JS代码标准化，兼容以gecko为内核的浏览器于2006-10-30重写     //http://www.forest53.com          var speed=30;     var FGDemo=document.getElementById('demo');     var FGDemo1=document.getElementById('demo1');     var FGDemo2=document.getElementById('demo2');     FGDemo2.innerHTML=FGDemo1.innerHTML     function Marquee1(){     if(FGDemo2.offsetHeight-FGDemo.scrollTop<=0)     FGDemo.scrollTop-=FGDemo1.offsetHeight     else{     FGDemo.scrollTop++     }     }     var MyMar1=setInterval(Marquee1,speed)     FGDemo.onmouseover=function() {clearInterval(MyMar1)}     FGDemo.onmouseout=function() {MyMar1=setInterval(Marquee1,speed)} </script> </div> <div id="FGFooter"><span id="FGdesc2">My Photo 1</span><a href="http://www.forest53.com">Design by Forestgan</a></div> </div> </div> </div> <div id="forestganFooter">   <address>   演示页面设计制作： <a href="http://www.forest53.com">Forestgan</a> &nbsp;&nbsp;采用<a href="http://www.creativecommons.cn/">创作共用授权</a>--署名和非商业用途<a href="javascript:history.back()">返回前一页</a>   </address> </div> <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"> </script> <script type="text/javascript"> _uacct = "UA-152060-1"; urchinTracker(); </script> <noscript> <p>google-analytics</p> </noscript> <script src="/js/copyrightdemo.js" type="text/javascript"></script> <noscript><p>my stat</p></noscript> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

图片连续不间断滚动像册

一种基于浏览器的自动小票机打印实现方案(js版)
这篇文章主要介绍了一种基于浏览器的自动小票机打印实现方案(js版)的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
2016-07-07
js实现按钮进行某行上移下移
这篇文章主要为大家详细介绍了js实现按钮进行某行上移下移，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-02-02
uniapp实现下拉刷新与上拉触底加载功能的示例代码
这篇文章主要记录一下uniapp实现下拉刷新与上拉触底加载功能的示例代码，文中的示例代码讲解详细，感兴趣的小伙伴可以跟随小编一起学习一下
2023-04-04
参考：关于Javascript中实现暂停的几篇文章
参考：关于Javascript中实现暂停的几篇文章...
2007-03-03
一文教会你提高Javascript代码效率的技巧
这篇文章主要给大家介绍了关于提高Javascript代码效率的技巧,通过这些技巧可以提高大家工作效率,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-07-07
JavaScript实现动态加载删除表格
这篇文章主要为大家详细介绍了JavaScript实现动态加载删除表格，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-04-04
JavaScript逆向调试技巧总结分享
当我们抓取网页端数据时,经常被加密参数、加密数据所困扰,如何快速定位这些加解密函数,尤为重要,下面这篇文章主要给大家介绍了关于JavaScript逆向调试技巧的相关资料,需要的朋友可以参考下
2022-06-06
web 屏蔽BackSpace键实例代码
在web端，输入的时候，很容易在文本框消失焦点的时候，点击退格键，页面就回退了，下面是一种屏蔽页面回退键的方法,一起看看吧
2016-12-12
js实现购物网站放大镜功能
这篇文章主要为大家详细介绍了js实现购物网站放大镜功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-06-06
Typescript使用修饰器混合方法到类的实例
这篇文章主要介绍了Typescript使用修饰器混合方法到类的实例，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-09-09