HTML标签marquee实现滚动效果

原创 2016年08月29日 15:51:51

页面的自动滚动效果,可由javascript来实现,但是今天无意中发现了一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制。

使用marquee标记不仅可以移动文字,也可以移动图片,表格等.

语法:<marquee>...</marquee>; 说明:在标记之间添加要进行滚动的内容。

重要属性:

1.滚动方向direction(包括4个值:up、 down、 left和 right)

  语法:<marquee direction="滚动方向">...</marquee>

2.滚动方式behavior(scroll:循环滚动,默认效果; slide:只滚动一次就停止; alternate:来回交替进行滚动)

  语法:<marquee behavior="滚动方式">...</marquee>

3.滚动速度scrollamount(滚动速度是设置每次滚动时移动的长度,以像素为单位)

  语法:<marquee scrollamount="5">...</marquee>

4.滚动延迟scrolldelay(设置滚动的时间间隔,单位是毫秒

  语法:<marquee scrolldelay="100">...</marquee>

5.滚动循环loop(默认值是-1,滚动会不断的循环下去)

  语法:<marquee loop="2">...</marquee>

6.滚动范围width、height

7.滚动背景颜色bgcolor

8.空白空间hspace、vspace


常用的事件:onMouseOut(鼠标移出该区域),onMouseOver(鼠标移入该区域)


示例:

	 			
	<marquee direction="left" behavior="scroll" scrollamount="5" scrolldelay="0" loop="-1" width="1000" height="50" bgcolor="#0099FF" hspace="10" vspace="10">
指整个Marquee对齐方式; (2)behavior:设置滚动的方式: scroll:表示由一端滚动到另一端,会重复,缺陷是不能无缝滚动。 slide:表示由一段滚动到另一端,不会重复...
</marquee>


版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

HTML标签marquee实现滚动效果

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

Html 标题滚动效果实现 marquee标签属性

开发时遇到一个问题,同一个网页可能在不同的环境下打开,亦可能是PC端,又亦是手机端。而在手机端时由于手机型号不同的分辨率也尽然不同,导致标题显示时无法显示完全,或撑大原标签导致界面变形。 问题描述:...

HTML标签marquee实现滚动效果

使用marquee标记不仅可以移动文字,也可以移动图片,表格等.语法:...; 说明:在标记之间添加要进行滚动的内容。重要属性:1.滚动方向direction(包括4个值:up、 down、 left...

HTML标签marquee实现滚动效果

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

html页面滚动效果之marquee标签详解

html之marquee详解 该标签不是HTML3.2的一部分,并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可能无法看到下面一些很有意思的效果...

实现字体滚动效果的标签 <marquee>详解

html标签——可以实现多种滚动效果,无需js控制。使用marquee标签不仅可以滚动文字,也可以滚动图片,表格等,而且使用起来方便快捷。 该标签是个容器标签 语法: 以下是一个...

marquee标签实现跑马灯效果--无缝滚动

今天在做微信端的大转盘抽奖时,想把所有用户的抽奖记录做成无缝滚动的效果,无奈我的js功底太差,一时想不出实现的方法,便百度各种相似效果。但无意中发现了一个html标签——可以实现多种滚动效果,无需js...

html之marquee实现图片文字滚动效果详解

在制作网页的时候,很多情况下会遇到需要某一个文字或者图片像广告那样水平或者垂直的滚动,这样的效果 JavaScript可以制作,但是比较麻烦,直接看那些代码会感觉到非常的复杂。这里我们来介绍一种简单...

HTML中让图片滚动的<marquee>标签的使用方法

实例:  <marquee id="affiche" align="left" behavior="scroll" bgcolor="#FF0000" direction="up" heigh...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)