第一步:将图片大小为290*150像素的九张图片,分别命名为:1.jpg;2.jpg;3.jpg;4.jpg… 9.jpg
第二步:在桌面在创建一个文件夹,命名为"left",将9张图放在这个文件夹里
第三步:用flashfxp软件将left文件夹上传到data目录下
第四步:复制以下代码到网站管理后台的代码区。详细操作步骤如下:先复制以下代码,然后打开后台的网页编辑器(比如底部区),在需要放滚动效果的位置,输入几个汉字,比如“我要做向左滚动图片效果”,然后单击“代码”视图,在代码里选中“我要做向左滚动图片效果”这几个字,然后按ctrl+V键,最后点保存,即可将滚动效果放在网页相应的位置。
以下是代码片段:<div id=demo style=overflow:hidden;height:150;width:500;background:#214984;color:#ffffff> <style type="text/css">img{ border:0px; }</style> <table align=left cellpadding=0 cellspace=0 border=0> <tr> <td id=demo1 valign=top> <a href="http://www.51rich.net" target="_blank"><img src="data/left/1.jpg" ></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/2.jpg" ></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/3.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/4.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/5.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/6.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/7.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/8.jpg"></a><a href="http://www.51rich.net" target="_blank"><img src="data/left/9.jpg"></a> </td> <td id=demo2 valign=top></td> </tr> </table> </div>
<script> var speed=10; demo2.innerHTML=demo1.innerHTML; function Marquee() { if(demo2.offsetWidth-demo.scrollLeft<=0) { demo.scrollLeft-=demo1.offsetWidth; } else { demo.scrollLeft++; } } var MyMar=setInterval(Marquee,speed); demo.onmouseover=function() { clearInterval(MyMar); } demo.onmouseout=function() { MyMar=setInterval(Marquee,speed); } </script>
1、 <a href="http://www.51rich.net" target="_blank"><img src="data/left/1.jpg" border="0"></a> 每张图片都是由这段代码所组成的, 绿色部份是图片连接的网址;紫色是图片所放的位置 2、 <div id=demo style=overflow:hidden;height:150;width:500;background:#214984;color:#ffffff> 代码中蓝色部份是整个滚动效果页面的高度与宽度;红色部分是背景色,修改这个颜色代码就可更换蓝色背景
3、 var speed=10; 这是控制滚动速度的,修改10 这个数值即可。数值越大,速度越慢。
4、如果需要滚动图片需要边框,就删除以下这段代码即可<style type="text/css">img</style>
效果图如下:
首 页| 关于点点 | 建站帮助 | 客服中心 | 友情链接 | 服务条款 | 付款方式 | 广告服务 | 联系我们 | 网站地图 免费代码大全
本站还提供无锡本地建站服务:无锡网站建设 无锡央视广告 无锡央视展播 无锡企业媒体网站信息发布 无锡企业媒体专访
业务部邮箱:dd118@dd118.com 客服部邮箱:kefu@dd118.com 技术部邮箱:jishu@dd118.com
Copyright @2005-2019 diandiannet Inc 版权所有: 无锡国搜信息科技有限公司(原无锡点点网络科技有限公司)
苏ICP备07508751号 ip5108.htm 流量专家