图片滚动代码.doc
【精品文档】如有侵权，请联系网站删除，仅供学习与交流图片滚动代码.精品文档.<embed src=" quality="high" width="480" height="400" align="middle" allowScriptAccess="sameDomain" allowFullscreen="true" type="application/x-shockwave-flash"></embed>图片滚动代码 (从右向左滚动)<marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"><img border="0" src="要滚动的图片地址1"> <img border="0" src="要滚动的图片地址2"> </marquee>图片滚动代码 (从下往上滚动) <marquee onMouseOver="this.stop()" onMouseOut="this.start()" align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"><img border="0" src="要滚动的图片地址1"> <img border="0" src="要滚动的图片地址2"> </marquee>改版：<marquee ONMOUSEOUT=this.scrollDelay=1 ONMOUSEOVER=this.scrollDelay=600 scrollamount=1SCROLLDELAY=1 border=0 direction=up scrolldelay=70 width=180 height=130 align=middle><img border="0" src="要滚动的图片地址1"> <img border="0" src="要滚动的图片地址2"> </marquee>说明：1.direction属性:决定文本的滚动方向，分为向左left和向右right，up和down默认状态向左。<marquee direction=left>从右向左滚动</marquee><marquee direction=right>从左向右滚动</marquee>2.behavior属性:指定文本的滚动方式，分为三种:Scroll:从一端消失后，在另一端出现并继续滚动。<marquee behavior=scroll>一圈一圈地滚动</marquee>Slide:从一端滚动，接触到另一端后停止<marquee behavior=slide>只滚动一次就停止</marquee>Alternate:从一端滚动到另一端后，反向滚动。 <marquee behavior=alternate>来回滚动</marquee>direction=up（left、right、down） 这个属性可以更改，这样就可以实现上下左右了3.scrolldelay属性设置移动每步的延时单位为毫秒4.scrollamount 属性 设置滚动速度 单位为秒，取值 1-60 示例:<!*图片滚动*><DIV align=center><MARQUEE scrollAmount=1 scrollDelay=1 direction=right behavior=alternate width=300 height=200 BORDER="0" ALIGN="middle"><IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0> <IMG src=" border=0>/MARQUEE>/DIV><!*图片滚动结束*>dreamweaver里怎么让图片连续的不间断的滚动<html><head><title>图片滚动</title></head><body><div id="marquee_demo" style="overflow:hidden;width:100%;text-align:center;border:1px solid #0066cc"><table cellspacing="0" cellpadding="3" align="center" border="0"><tr><td id="marquee_product1" valign="top"><table width="100%" height="100" border="0" cellpadding="2" cellspacing="0"><tr><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td><td><a href="#"><img src=" border=0></a></td></tr></table></td><td id="marquee_product2" valign="top"></td></tr></table></div><script type="text/javascript">var speed=30;marquee_product2.innerHTML=marquee_product1.innerHTML;function Marquee()if(marquee_demo.scrollLeft>=marquee_product1.scrollWidth)marquee_demo.scrollLeft=0;elsemarquee_demo.scrollLeft+;var MyMar=setInterval(Marquee,speed);marquee_demo.onmouseover=function()clearInterval(MyMar);marquee_demo.onmouseout=function()MyMar=setInterval(Marquee,speed);</script></body></html>如何用Dreamweaver制作滚动字幕和滚动图片 滚动字幕和滚动图片相信很多地方都会看见的，其实制作也非常简单，我也是自己学习的，今天就教给大家，希望有所帮助。制作滚动字幕大多数都会选择用Dreamweaver来做比较简单，也可以用PS制作，今天我就教大家用Dreamweaver来制作，没有这个软件的可以到网上下载就可以了，我是用的Dreamweaver8，开始做多试下，相信您也可以打造个属于自己风格的店铺！ 其实Dreamweaver很多学习都是比较有用的，如果有时间可以多了解哈，还有图片和字幕的链接都是可以在里面设置的，很方便。今天在这里罗嗦了，请多多谅解哦！下面是制作的详细步骤，希望对您有帮助！Dreamweaver 制作滚动字幕是使用“标签选择器”插入“marquee”标签，如下图所示！1、首先把光标插入点放在需要插入滚动字幕的地方，也可直接在代码那插入一样。2、点击插入面板的“标签选择器”页元素。3、选择“marquee”标签，点“插入”按钮。4、转换到代码栏，把光标插入点放到“marquee”标签内，然后输入您需要滚动的文字内容，如下图所示！5、选择窗口，标签的属性栏设置文字的各种用法。（1）、点behavior设置右边的下拉箭头，选择滚动文字的运动方式 altemate是文字在相反的方向滚来滚去. Scroll是文字向同一个方向滚动. Slicle是文字或图片接触到文字边框停止滚动.（2）、direction设置右边的下拉箭头，选择文字内容的滚动方向。 down 向下滚动 left 向左滚动 right向右滚动 up 向上滚动（3）、width 滚动内容的宽度。6、标签检查器属性旁边的“行为”也是可以设置的，设置滚动文字的动作，常为停止滚动或设置鼠标离开滚动字幕的动作。 事件on Monseover 动作this.stop()； 事件on Mouseout 动作this.start()； 好啦，该睡觉了哦，希望对自己学习装修店铺的朋友有所帮助，其实滚动字幕和滚动图片是一样的设置，自己多试试就很快会了，打造一个属于自己的店铺是有必要的哦，因为是第一次写这种文章，在这里献丑了，希望高手朋友多多指教，写得不好，请谅解！如有不明白的地方可以留言跟贴或来小店联系，我一定尽最大努力解决！希望可以共同交流，彼此学习！祝大家“端午”节快乐！还有很多免费的装修素材，如有需要可以和我联系，希望能有所帮助！送给大家一套向上滚动的字幕代码，直接将代码放到您需要滚动的地方。<marquee behavior="scroll" direction="up" width="200" height="150" loop="-1" scrollamount="1" scrolldelay="1" style="font:12px;" onMouseOver="this.stop();" onMouseOut="this.start();"><span class="STYLE1"> 缘衣轩韩版服饰店欢迎您！这里内容换成您自己的文字</span></marquee>Dreamweaver图片滚动代码图片滚动代码 (从右向左滚动)<marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"><img border="0" src=" http:/要滚动的图片地址1"><img border="0" src=" http:/要滚动的图片地址2"></marquee>图片滚动代码 (从下往上滚动)<marquee onMouseOver="this.stop()" onMouseOut="this.start()" align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"><img border="0" src=" http:/要滚动的图片地址1"><img border="0" src=" http:/要滚动的图片地址2"></marquee>文字来回滚动代码：<marquee behavior="alternate" width="90%" height="100" scrollamount="3" scrolldelay="30" ><a target="cont" href=" 年轻无极限</a></marquee>我来解说一下上面的代码的意思吧! marquee behavior="alternate"这是来回滚动的代码 scrollamount="3" 这里面的 3 字 表示文字滚动的速度 数字越大滚动的速度也越快 width="100" 表示你的图片的宽度height="100" 表示你的图片的高度360度的全景照片网页上欣赏到360度的全景照片是一件很有趣的事，不要担心制作过程会很复杂，我们在这里介绍一种最简单的方法，同样可以达到效果，学起来很容易，只要会一点点html和css的基本语法就足够了。注意：这个效果只有用IE浏览器才能看到。下面我们来看看整个的制作过程：第一步：准备一张全景图片。您可以自己拍也可以从网上下载。当然如果您摄影技术足够高的话我还是建议你自己拍一张（题材如家庭居室的全景等），这样显得更加生动一些；如果你和我一样是个摄影菜鸟，那么还是在网上找一幅吧，如果也不是那么好找，我这里提供给你两幅照片：前者是一个棒球场的全景，后者是一个办公室的全景，图片名称分别是yl-020315-3d.jpg和yl-020315-3d2.jpg。第二步：做一个表格存放图片用Dreamweaver等网页制作软件做一个1行2列的表格，以便在左边的单元格内放置滚动的文字说明，右边的单元格放置全景图片。在表格属性中作如下设置：border="0" cellspacing="0" cellpadding="0" height="150" width="220"，注意高度和所选的全景图片一致；左侧单元格宽度为20，右侧为200；为表格做个边框，我们可以利用css定义：style="border:#333366 3 double"，即边框颜色采用#333366，宽度为3，线形为双线。然后我们再给两个单元格中间设置分界线，即对左侧单元格使用样式：style="border-right:#333366 3 double"，颜色线型和表格外框一致；接着将左侧单元格的背景色设置为#333366，把右侧单元格的背景设置为yl-020315-3d.jpg，即作成如下模样：第三步：使全景图片移动要使图片移动的方法很多，如用Dreamweaver的层和时间线，用javascript，甚至可以用java applet,不过我们这里用简单的：marquee。我们先了解一下marquee的主要参数：bgcolor 背景颜色，可输入颜色的英文名称或者16进制代码等； direction=left|right|up|down 滚动方向（左|右|上|下） behavior=scroll|slide|alternate scroll表示由一端滚动到另一端；slide表示由一端快速滑动到另一端，不再重复； alternate表示在两端之间来回滚动； height数值 滚动区域的高度； width=数值 滚动区域的宽度； scrollamount=数值 决定滚动的速度，数值越大滚动越快； Scrolldelay=数值 延迟时间，数值越大跳跃越明显； loop数值 循环次数，不设置该值即表示无限循环。 注意，marquee不仅可以使文字滚动，也可以使图片滚动，只要在<marquee>和</marquee>间插入<img src=url>就可以了。下面我们就把全景图片插入到右侧的单元格中，代码如下：<td background="yl-020315-3d.jpg"><marquee behavior=scroll direction=left width=200 height=150 scrollamount=2 scrolldelay=0><img src="yl-020315-3d.jpg" width="800" height="150"></marquee></td> 然后我们对它添加一些行为：onClick="this.start()" 当鼠标点击时开始播放； onMouseOver="this.stop()" 当鼠标移入时停止播放； onMouseOut="this.start()" 当鼠标移出时继续播放。另外，我们还可以加上标题：style="title:标题内容"；改变鼠标式样：style="cursor:hand"等，全部代码如下：<td background="yl-020315-3d.jpg" title="360全景图单击开始播放"><marquee style="cursor:hand" behavior=scroll direction=left width=200 height=150 scrollamount=2 scrolldelay=0 onClick='this.start()' onMouseOver='this.stop()' onMouseOut='this.start()'><img src="yl-020315-3d.jpg" width="800" height="150"></marquee></td> 如果你细心的话会发现图片滚动时头尾对接不上，解决的办法是在插入图片的地方重复多插几次图片，或者使用一点javascript语句让图片循环滚动。<script language=javascript>for(t=1;t<=1000;t+)document.write("<img src=3d.jpg width=906 height=143>"</script> 第四步：制作滚动的文字说明制作滚动文字对大家来说是家常便饭，至于怎样把文字竖排也不难，只要加上如下样式：style="writing-mode:tb-rl"即可，其中tb表示top-bottom，rl表示right-left。代码如下： <td bgcolor="#333366" style="border-right:#333366 3 double"><marquee style="cursor:hand" behavior=scroll direction=right width=20 height=150 scrollamount=1 scrolldelay=0 onmouseover='this.stop()' onmouseout='this.start()'><font style="margin-top:20;writing-mode:tb-rl;font-size:9pt" face="楷体_GB2312" color="#ffffff">全景效果图<br> <br>三百六十度<br> <br>全方位展示画面<br> <br>乐趣多多！<br> <br>xxxx制作</font></marquee></td>
