`
wsql
  • 浏览: 11792947 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

Html <MARQUEE>滚动文字

 
阅读更多

代码如下<MARQUEE>滚动文字</MARQUEE>

<marquee style="WIDTH: 388px; HEIGHT: 200px" scrollamount="2" direction="up" >
<div align="left" ><br />
</div >
<center ><font face="黑体" color="#008000" size="4" ></font ></center >
<div align="left" ><br />
</div >
<center >
<p ><font color="#ff6600" size="4" >滚动文字</font ></p >
<p ><font color="#ff4500" size="4" >滚动文字</font ></p >
<p ><font color="#ff3300" size="4" >滚动文字</font ><br />
<br />
</p >
</marquee >

marquee 参数:
BGColor:滚动文本框的背景颜色。
Direction:滚动方向设置,可选择Left、Right、up和down。
scrolldelay:每轮滚动之间的延迟时间,越大越慢。
scrollamount:一次滚动总的时间量,数字越小滚动越慢。
Behaviour:滚动的方式设置,三种取值:Scroll(循环滚动) lide(单次滚动)、Alternate(来回滚动)。
Align:文字的对齐方式设置。可选择Middle(居中)、Bottom(居下)还是Top(居上)。
Width:滚动文本框的宽度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。
Height:滚动文本框的高度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。
loop:滚动次数。默认为infinite
hspace、vspace:前后、上下的空行。

滚动字幕会让很多人感到兴奋,特别是第一次使用滚动字幕时,会爱不释手。滚动字幕我也做得不少了,对它也不会兴奋了,所以现在也用得不多了。有不少朋友常问到这是怎么做的,现在做一个详细的专题,让你更全面地了解一下。
滚动字幕在FrontPage的组件里有,但是FrontPage这个软件只能支持单行文字,一出现多行文字它就无能为力了,而且它只能支持一行滚动! (如果出现只能滚动一行的情况,解决办法是把这段代码嵌入到JavaScript的document.write里面,请看下面例d的详细说明) Dreamweaver也只能用编写HTML代码的方法。所以强烈建议用记事本打开网页源代码来编辑。

1.建立第一个滚动字幕。代码:
<marquee scrollAmount=2 width=300>靓丽风景线</marquee>
效果如: 靓丽风景线

2.各参数详解:
a)scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。
b)width和height,表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值。
c)direction。表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。
d)scrollDelay,这也是用来控制速度的,默认为90,值越大,速度越慢。通常scrollDelay是不需要设置的。
e)behavior。用它来控制属性,默认为循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)

3.实例:
a)如何给滚动字幕加超链接?这跟平时的超链接是完全一样的。只要在文字外面加上<a href=***>和</a>就可以了。如下效果,代码是<marquee scrollAmount=2 width=300><a href=http://www.cctv.com>中央电视台</a></marquee>,点击中央电视台就可以进入了:
中央电视台

b)如何制作当鼠标停留在文字上,文字停止滚动?
代码如:
<marquee scrollAmount=2 width=300 onmouseover=stop() onmouseout=start()>文字内容</marquee>
效果如:
文字内容

c)交替效果。代码如:
<marquee scrollAmount=2 width=99 behavior=alternate>文字内容</marquee>
效果如:
文字内容

d)多行文本向上滚动。代码如:
<marquee scrollAmount=2 width=300 height=160 direction=up>·早晨好啊!<br>·空气好清新啊<br>·你还好吗<p>·<a href=http://www.cctv.com>靓丽风景线</a></marquee>
效果如:
·早晨好啊!
·空气好清新啊
·你还好吗
·靓丽风景线

·注意:如果你的网页经过了FrontPage编辑,保存之后,只能滚动一行,这时候你发现你原来的代码顺序已经变了,My god!解决的办法是,找出原来的代码,把它嵌入到JavaScript的document.write中即可,上述代码写为:
<script>document.write('<marquee scrollAmount=2 width=300 height=160 direction=up>·早晨好啊!<br>·空气好清新啊<br>·你还好吗 <p>·<a href=http://www.cctv.com>靓丽风景线</a></marquee>')< /script>

e) 改变滚动字幕的颜色?可以用样式表来控制。如下效果,代码是<marquee scrollAmount=2 width=300><a style=color:CC6600>你还好吗</a></marquee>。
你还好吗

图片滚动
用<img src=相对路径/文件名>的语句。并且要注意图片名不要中文,要注意区分英文大小写。

图片做超链接
用<a href=>和</a>把<img>包围,并且img必须设border=0,否则图片会出现蓝框。正确的例子如: <a href=http://www.webshu.com><img src=../../j/01.jpg border=0></a>
其中a href=表示超链接,这是最常用的。练习的方法也很简单,就是平时用FP或DW做网页的时候,要多查看源代码。

多张图片排列滚动
通常图片和图片之间用<br>(回行)或<p style=margin-top:9>(精确调整图片间的距离)来链接。也可以把你的图片先用表格排版,然后把这个表格的所有语句也加入到marquee中,让这个表格来滚动。

代码<script>document.write('<marquee scrollAmount=2 width=340 height=160 direction=up onmouseover=stop() onmouseout=start()><a href=http://www.webshu.com><img src=../../j/01.jpg border=0></a></marquee>')</script>

分享到:
评论

相关推荐

    HTML标签marquee实现滚动效果

    HTML标签marquee实现滚动效果,实现文字在网页中漂移的代码。

    HTML标签marquee实现滚动效果的简单方法(必看)

    页面的自动滚动效果,可由javascript来实现,但是今天无意中发现了一个html标签 – &lt;marquee&gt;&lt;/marquee&gt;可以实现多种滚动效果,无需js控制。 使用marquee标记不仅可以移动文字,也可以移动图片,表格等. 语法:...

    HTML标签marquee实现多种滚动效果(无需JS控制)

    页面的自动滚动效果,可由javascript来实现,但是今天无意中发现了一个html标签 – &lt;marquee&gt;&lt;/marquee&gt;可以实现多种滚动效果,无需js控制。 使用marquee标记不仅可以移动文字,也可以移动图片,表格等. 语法:...

    文字左右无缝滚动JS(前端技术分享)

    网上找了很多文字无缝滚动的都是坑爹货,这个不是HTML自带的&lt;MARQUEE&gt;滚动文字&lt;/MARQUEE&gt;滚动,而是JS实现的左右滚动

    JSpaomadeng.html

    js跑马灯 连续不断地出现文字的滚动 效果强于html标签&lt;marquee&gt;&lt;/marquee&gt;

    网页HTML代码:滚动文字的制作

    HTML技术中使文字滚动的方法是使用双标签&lt;marquee&gt;&lt;/marquee&gt;。在HTML代码中可使其作用区文字滚动,默认为从右到左,循环滚动。在D:\web\目录下创建网页文件,命名为mar.htm,编写代码如代码4.15所示。 代码4.15 ...

    html借助marquee实现文字左右滚动

    //借助于marquee&lt;MARQUEE behavior=”scroll” contenteditable=”true” xss=removed scrollamount=”3″ width=”100″&gt;&lt;SPAN unselectable=”on”&gt;这里是要滚动的内容&lt;/SPAN&gt;&lt;/MARQUEE&gt; //普通的实现方法&lt;DIV ...

    纯js不间断滚动

    纯js不间断滚动代码 来源: ...使用方法: 应用说明:页面包含&lt;script type=... 8、鼠标悬停滚动思想源自Flash,所以有一定的局限性(容器内仅允许用图片&lt;img&gt;或者带链接的图片&lt;a&gt;&lt;img&gt;&lt;/a&gt;的形式,并需要禁止其自动换行)

    vue 实现走马灯效果

    Part.1 问题 在写一个H5页面时遇到一个需求,头部公告需要滚动变换,需要实现一个走马灯效果 Part.2 实现 我的做法:利用 定时器 + ... &lt;div class=marquee&gt; &lt;div class=marquee_box&gt; &lt;ul class=marquee_list

    javascript特效无缝滚动marquee

    实现图片文字,向左,向右,向上,向下无缝滚动,适合广告图片展示 浏览器兼容(IE、FF、Opera、NS、MYIE)

    JavaScript文本特效实例小结【3个示例】

    本文实例讲述了JavaScript文本特效。分享给大家供大家参考,具体如下: 1、标题跑马灯 常常能够在一些新闻网站,或者其他地方,看到文字在一个特定的区域内,来回... &lt;p&gt; 标题栏上实现的文字跑马灯&lt;/p&gt; &lt;/font&gt; &lt;/

    JS与HTML结合使用marquee标签实现无缝滚动效果代码

    最近在做一个前端开发的项目,需要实现无缝滚动效果,上下左右无缝滚动。下面小编把实现代码分享到软件开发网平台,需要的朋友可以参考下,有bug欢迎提出,共同学习...一行多列文字循环滚动带停顿-&lt;/TITLE&gt; &lt;m

    文字上下相接 滚动.html js

    &lt;script type="text/javascript"&gt; var Marquee = function(id){ try{document.execCommand("BackgroundImageCache", false, true);}catch(e){}; var container = document.getElementById(id), slide = ...

    javascript 模拟Marquee文字向左均匀滚动代码

    Marquee是HTML语言里固有的文字滚动标签,虽然用着方便,但是功能上有一些限制,很多时候我们都是通过JavaScript来补充这一功能.

    jquery实现marquee效果(文字或者图片的水平垂直滚动)

    原本在前端html代码中,实现文字或者图片的水平垂直滚定,都是使用的marquee,但随着考虑浏览器的兼容性和符合为w3c的标准,后来想想那还是使用javascript代码来实现。后来又喜欢上了jquery,下面写的内容希望对初学...

    鼠标移上,文字滚动,移开则停止

    鼠标移上,文字滚动,移开则停止. 防marquee 特效

    文字或者图片上下无缝滚动

    实现文字无缝滚动+css无缝滚动,特别是phper,前后端不分离,需要自己写样式,该例子能很好的帮助到后端开发者。不是使用marquee这个属性,这个属性有问题,滚动完一遍数据后不能实现无缝衔接,次案例采用的是css和...

    怎么把select下拉菜单里的文字设置成左右滚动效果

    希望用marquee标签来设置字体滚动,...=js.toString()%&gt;” style=”width:260px”&gt; &lt;logic name=”proj_list”&gt; &lt;marquee direction=”left” behavior=”scroll” scrollamount=”10″ scrolldelay=”200″&gt; &lt;ht

Global site tag (gtag.js) - Google Analytics