您的位置：首页 > 百科管理 > 详情

海报跑马灯代码-谁能给点HTML跑马灯效果的代码？

原创：找图网 2023-07-29 10:05:52

网页图片跑马灯效果代码

跑马灯大全

海波吧

<!--

Begin

var

Mes=new

Array();

Mes[0]="海波吧欢迎你";

Mes[1]="感谢你关注海波吧";

Mes[2]="网页制作技巧之跑马灯大全

var

place=1;

var

i=0;

function

scroll()

{

=Mes[i].substring(0,

place);

(place

Mes[i].length)

{

if(i<2)

{

i++;

place=1;

("scroll()",50);

}

else

{

i=0;

place=1;

("scroll()",50);

}

else

{

place++;

("scroll()",50);

}

End

-->

滚动的文字

表示双向移动

表示运动方向向左

弹来弹去跑马灯!

表示运动方向向左

target=_blank>带有超链接的跑马灯!点点看

target=_blank>还有一条!点点看

参数

用法介绍

behavior=scroll,

slide,

alternate

跑马方式:循环绕行,只跑一次就停住,来回往复运动

direction=left,right

跑马方向:从左向右,从右向左

loop=100

跑马次数:循环100次,如不写默认为一直循环

width=100%,height=200

跑马范围:宽为100%,高为200像素

scrollamount=20

跑马速度:数越大越快

scrolldelay=500

跑马延时:毫秒数,利用它可实现跃进式滚动

hspace=20,vspace=20

跑马区域与其它区域间的空白大小

bgcolor=#00FFCC

跑马区域的背景颜色

谁能给点HTML跑马灯效果的代码？

<marquee>...</marquee>普通卷动

<marquee behavior=slide>...</marquee>滑动

<marquee behavior=scroll>...</marquee>预设卷动

<marquee behavior=alternate>...</marquee>来回卷动

<marquee direction=down>...</marquee>向下卷动

<marquee direction=up>...</marquee>向上卷动

<marquee direction=right></marquee>向右卷动

<marquee direction=’left’></marquee>向左卷动

<marquee loop=2>...</marquee>卷动次数

<marquee width=180>...</marquee>设定宽度

<marquee height=30>...</marquee>设定高度

<marquee bgcolor=FF0000>...</marquee>设定背景颜色

<marquee scrollamount=30>...</marquee>设定滚动速度

<marquee scrolldelay=300>...</marquee>设定卷动时间

<marquee onmouseover="()">...</marquee>鼠标经过上面时停止滚动

<marquee onmouseover="()">...</marquee>鼠标离开时开始滚动

dreamweaver网页制作中，怎样实现图片的走马灯效果

打开 Dreamweaver

新建 HTML 文档;

修改标题为"跑马灯"

保存为文件。

首先,编写跑马灯部分的静态 HTML 代码,把图片排列起来

在 <body> 和 </body> 标签中添加以下代码:

<div>

<ul>

</ul>

</div>

给上一步的 HTML 代码中的 div 标签增加 class 属性,如下:

编写跑马灯部分的 CSS 样式代码,代码放在 <head> 和 </head> 标签中,如下:

ul{list-style:none; padding:0; margin:0;}

.con{ width:1105px; height:225px; overflow:hidden; border:2px solid #666; margin:10px auto 0 auto; padding:5px 0 0 5px;}

.con ul li{ float:left; margin:0 5px 10px 0;}

.con ul li img{ display:block; width:209px; height:209px; padding:2px; border:1px solid #ccc;}

</style>

引入 JQuery 库

引入 Marquee 插件

代码放在 </body> 标签前,如图:

给 div 增加 marquee 类

保存文件,在浏览器中打开,就可以看到图片开始滚动了。

图片默认的滚动方向是“向上滚动”

如果要修改图片滚动的方向,可以给 div 指定 direction 属性,属性值可以取:

up 上

down 下

left 左

right 右