[HTML代码]会移动的文字(Marquee)

Marquee标记用于在可用浏览区域中滚动文本。这个标记只适用于IE3以后的版的浏览器。

格式:

BEHAVIOR="…"

BGCOLOR="…"

DIRECTION="…"

HEIGHT="…"

WIDTH="…"

HSPACE="…"

VSPACE="…"

LOOP="…"

SCROLLAMOUNT="…"

SCROLLDELAY="…"

ONMOUSEOUT=this.start()

ONMOUSEOVER=this.stop()

>…

属性:

ALIGN:用于按设定的值对齐滚动的文本。ALIGN可以设定的值有:LEFT,CENTER,RIGHT,TOP,BOTTOM。此属性不是必须使用的。

例:

这段滚动文字设定为上对齐

BEHAVIOR:可以在页面上一旦出现文本时让浏览器按照设定的方法来处理文本。如果设定的方法是SLIDE,那么文本就移动到文档上,并停留在页边距上。如果设定为ALTERNATE,则文本从一边移动到另一边。如果设定为SCROLL,文本将在页面上反复滚动。本属性不是必须使用的。可以设定的值有:SILIDE,ALTERNATE,SCROLL。

例:

文字从一边移动到另一边

BGCOLOR:用于设定字幕的背景颜色。背景颜色可用RGB、16进制值的格式或颜色名称来设定。

例:

用颜色名称设定滚动文字背景颜色为红色

用16进制值设定滚动文字背景颜色为红色

用RGB设定滚动文字背景颜色为红色

DIRECTION:用于设定文本滚动的方向,可以设定的值有:LEFT,RIGHT。此属性不是必须使用的。

例:

文字向左边滚动

文字向右边滚动

HEIGHT:用于设定滚动字幕的高度,高度可用像素或可视页面的百分比来表示。此属性不是必须使用的。

例:

滚动字幕的高度是可视页面的10%

滚动字幕的高度是12像素

WIDTH:用于设定字幕的宽度,宽度可用像素或可视页面的百分比来表示。此属性不是必须使用的。

例:

滚动字幕的宽度是可视页面的90%

滚动字幕的宽度是200像素

HSPACE:用于设定滚动字幕左右的空白空间,空白空间用像素表示。此属性不是必须使用的。

例:

滚动字幕左右空白空间为15个像素

VSPACE:用于设定滚动字幕上下的空白空间,空白空间用像素表示。此属性不是必须使用的。

例:

滚动字幕上下的空白空间为2个像素

LOOP:用于设定滚动字幕的滚动次数。当LOOP的值为"INFINITE"或是"-1"时,则文字会无限制地滚动。此属性不是必须使用的。

例:

文字滚动无数次

文字滚动5次

SCROLLAMOUNT:用于设定每个连续滚动文本后面的间隔,该间隔用像素表示。此属性不是必须使用的。

例:

此文本后面的间隔为10个像素

SCROLLDELAY:用于设定两次滚动操作之间的间隔时间,该时间以毫秒为单位。此属性不是必须使用的。

例:

此文本两次滚动之间的间隔时间为5毫秒

ONMOUSEOUT=this.start() :用来设置鼠标移出该区域时继续滚动

ONMOUSEOVER=this.stop():用来设置鼠标移入该区域时停止滚动

-------------------------------------------------------------

------------------------------------------------------------

基本语法

...

文字移动属性的设置

方向

#=left, right 从右向左移!

方式

#=scroll, slide, alternate 一圈一圈绕着走!

只走一次就歇了!

来回走

循环

#=次数;若未指定则循环不止(infinite) 只走

3 趟

只走 3 趟

只走 3 趟!

速度

啦啦啦,我走得好快哟!

延时

啦啦啦,我走一步,停一停!

外观(Layout)设置

对齐方式(Align)

#=top, middle, bottom

啦啦啦,我会移动耶!

底色

#=rrggbb 16 进制数码,或者是下列预定义色彩:

Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,

Fuchsia, White, Green, Purple, Silver, Yellow, Aqua 颜色!

面积

面积!

空白

(Margins)

面积!

我在向上走!

我又下向走了

补充一个无缝连接的循环滚动

for(t=1;t<=1000;t++)

document.write("11111111111112222222222222222233333333333333")

另一种实现无缝连接循环滚动得方法

width="80" height="80"

border="0">

width="80" height="80"

border="0">

width="80" height="80"

border="0">

width="80" height="80"

border="0">

nudeangel_2

nudeangel_3

nudeangel_4

nudeangel_5

inudeangel_6

nudeangel_7

demo2.innerHTML=demo1.innerHTML

function nudeangelMarquee(){

if(demo2.offsetTop-demo.scrollTop<=0)

demo.scrollTop-=demo1.offsetHeight

else

demo.scrollTop++

}

var repeat=setInterval(nudeangelMarquee,50);

demo.οnmοuseοver=function() {clearInterval(repeat);}

demo.οnmοuseοut=function() {repeat=setInterval(nudeangelMarquee,50);}

-----------------------------------------------------------

#=scroll, slide, alternate 一圈一圈绕着走!

最简单的图片移动特效———图片水平向左循环移动

转载以马内利

html中滚动代码怎么写,网页HTML滚动代码大全(一)相关推荐

  1. 网页广告代码php,【网页广告特效代码】精选5种常用的网页广告特效代码

    网站少不了发布一些活动广告,网页中的广告显示效果有很多种,一般是采用JS或者JQ实现多种网页广告显示效果,以下是php中文网精选5种常用的网页广告特效代码推荐给大家下载使用! 效果预览和下载地址:ht ...

  2. html中的保存功能代码怎么写,java保存html代码怎么写

    java保存html代码怎么写 [2021-01-31 03:29:24]  简介: php去除nbsp的方法:首先创建一个PHP代码示例文件:然后通过"preg_replace(" ...

  3. 一致性哈希算法 mysql_一致性哈希算法,在分布式开发中你必须会写,来看完整代码...

    今天我想先给大家科普下一致性哈希算法这块,因为我下一篇文章关于缓存的高可用需要用到这个,但是又不能直接在里面写太多的代码以及关于一致性hash原理的解读,这样会失去对于缓存高可用的理解而且会造成文章很 ...

  4. Springboot中如何优雅的写好Controller层代码

    前言 优雅?看到这个词,我第一反应是什么是优雅?怎么写才算优雅?一千个读者有一千个哈姆雷特,每个人的经验.阅历不同,也许理解就不同.我对优雅的理解很简单,就是简洁有效.容易理解,别那么多套路.java ...

  5. html中隐藏溢出怎么写,html溢出隐藏代码 css+div 溢出隐藏 无效

    css+div 溢出隐藏 无效 隐藏图片超出div部分代码如何写的? 把图片作为div的背景图片是最容易实现你所要的效果的方式: 如果一定要用img标签那就要css和js结合才能实现了: 请html代 ...

  6. html语言图片滚动代码,[转载]Html网页图片滚动代码

    style=overflow:hidden;height:100;width:90;> id=butong_net_top2> var speed=30 butong_net_top2.i ...

  7. 让图片居中php代码怎么写,CSS图片居中代码怎么写

    为了让网站页页美观效果更好,让图片居中应该怎么做呢?css图片居中代码怎么写呢?在这里为大家分享css如何让img图片居中,并附上代码. CSS图片居中方法一:利用display的table-cell ...

  8. 点击链接微信html代码怎么写,html5微信分享代码怎么写呢?

    html5微信分享代码怎么写呢?现在很多人都在微信好友或者朋友圈分享一下内容和别的有趣的文章或图片,但是你们知道分享的这些内容是怎样生成的吗?这些内容代码是怎样的呢?下面小编就给大家介绍一下关于 ht ...

  9. Java代码 怎么写很精简的代码 如何写又短又能满足需求的代码 如何写看起来很NB的代码 代码之极简之道

    目录 利用语法 1.利用三元表达式 2.利用 for-each 语句 3.利用 try-with-resource 语句 4.利用 return 关键字 5.利用 static 关键字 6.利用 la ...

最新文章

  1. 一个Python绘图示例程序中的几个语法糖果
  2. 清华姚班校友马腾宇斩获斯隆奖!与鬲融师承一脉,李飞飞点赞祝贺
  3. 删除单链上数据域值最小的节点_深入浅出数据结构
  4. android、ios、php之间AES加密解密
  5. Polymorphic form--多态表单
  6. 《众妙之门——自由网站设计师成功之道》一1.4 自由网站设计师犯的严重错误...
  7. android 多个复选框,Android UI控件之CheckBox(复选框、多选框)
  8. SourceTree的基本使用 - 天字天蝎 - 博客园
  9. 也从小站长视角浅谈主机提供商的优劣
  10. C++提高部分_C++函数模板_基本用法---C++语言工作笔记081
  11. 一步一步写算法(之快速排序)
  12. Unicode 和 UTF-8 的区别
  13. 新品Demo —— ZStack Mini 超融合一体机
  14. Docker数据持久化与容器迁移
  15. Vagrant安装CentOS7镜像
  16. 解决Word中出现的多级列表编号不显示的问题
  17. SSM整合尚硅谷Spring
  18. 31个惊艳的数据可视化作品,感受“数据之美”!
  19. Web2.0 网站介绍(3) - Flickr.com
  20. Codeup(云效)手把手教部署SpringCloud项目到私有主机

热门文章

  1. 前进中不能迷失方向--Java程序员职业发展路线
  2. 【大数据实验】06:MapReduce操作
  3. 一对一直播源码系统平台回归内容本质,才能站稳脚跟
  4. 车云链总经理赵大宝接待房车露营专委会秘书长吴宝忠
  5. 金蝶 EAS BOS 手工new 上下文
  6. Unity3D开发的2D游戏---《趣味推箱子》
  7. cok无法连接验证服务器,黎明杀机在线服务无法连接解决方法一览
  8. 【OpenCV】 人脸识别
  9. Java绝对/相对路径获取与getResourceAsStream()方法
  10. cesium-雨雪雾天气效果