会动的文字Marquee应用(转)
2013-12-02 18:02
411 查看
想要做个滚动公告,看了网上的教程,无一不是很恐怖的场频啊java语言编制的JS,或者就是各种复杂,无意中发现了Marquee这东西,用了一下,很简单,只需两行代码,即可以实现很好的效果,特此分享一下。
首先,Marquee是一个标签使用方法为<marquee 加属性参数>内容 </marquee> 然后用css定位即可以。定位时整个语句是被当作一个相对于上一级标签的对象,用padding进行定位即可。
下面介绍一下各种属性及参数的使用:
基本语法
啦啦啦,我会移动耶!
<marquee direction=right>啦啦啦,我从左向右移!</marquee>
啦啦啦,我从右向左移!
啦啦啦,我从左向右移!
<marquee behavior=slide>啦啦啦,我只走一次就歇了!</marquee> <P>
<marquee behavior=alternate>啦啦啦,我来回走耶!</marquee>
啦啦啦,我一圈一圈绕着走!
啦啦啦,我只走一次就歇了!
啦啦啦,我来回走耶!
<marquee loop=3 width=50% behavior=slide>啦啦啦,我只走 3 趟哟!</marquee> <P>
<marquee loop=3 width=50% behavior=alternate>啦啦啦,我只走 3 趟哟!</marquee>
啦啦啦,我只走 3 趟哟!
啦啦啦,我只走 3 趟哟!
啦啦啦,我只走 3 趟哟!
啦啦啦,我走得好快哟!
啦啦啦,我走一步,停一停!
<marquee align=# width=400>啦啦啦,我会移动耶!</marquee>
</font>
对齐上沿、中间、下沿。
啦啦啦,我会移动耶!对齐上沿。
啦啦啦,我会移动耶!对齐中间。
啦啦啦,我会移动耶!对齐下沿。
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua <marquee bgcolor=aaaaee>啦啦啦,我会移动耶!</marquee>
啦啦啦,我会移动耶!
啦啦啦,我会移动耶!
</marquee>
啦啦啦,我会移动耶!
********************************************<br>
嗨,
<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle>啦啦啦,我会移动耶!</marquee>
大家好!<br>
这是在某不知名网页找到的一个非常生动的应用。
一般只需marqueebehavior="" scrollamount="" hspace="" width="" height="" onmouseover="this.stop();" onmouseout="this.start();" 这几个属性即可以做出非常正式的滚动公告了。例如:http://www.huaihongjiu.com/index.asp(酒源酒业)首页滚动公告栏,可以参考一下。
这是本人研究了一晚上之后的一点点小心得,希望能对各位有所帮助。欢迎一起探讨。
首先,Marquee是一个标签使用方法为<marquee 加属性参数>内容 </marquee> 然后用css定位即可以。定位时整个语句是被当作一个相对于上一级标签的对象,用padding进行定位即可。
下面介绍一下各种属性及参数的使用:
基本语法
<marquee> ... </marquee>
<marquee>啦啦啦,我会移动耶!</marquee>啦啦啦,我会移动耶!
文字移动属性的设置
方向 <direction=#> #=left, right
<marquee direction=left>啦啦啦,我从右向左移!</marquee> <P><marquee direction=right>啦啦啦,我从左向右移!</marquee>
啦啦啦,我从右向左移!
啦啦啦,我从左向右移!
方式 <bihavior=#> #=scroll, slide, alternate
<marquee behavior=scroll>啦啦啦,我一圈一圈绕着走!</marquee> <P><marquee behavior=slide>啦啦啦,我只走一次就歇了!</marquee> <P>
<marquee behavior=alternate>啦啦啦,我来回走耶!</marquee>
啦啦啦,我一圈一圈绕着走!
啦啦啦,我只走一次就歇了!
啦啦啦,我来回走耶!
循环 <loop=#> #=次数;若未指定则循环不止(infinite)
<marquee loop=3 width=50% behavior=scroll>啦啦啦,我只走 3 趟哟!</marquee> <P><marquee loop=3 width=50% behavior=slide>啦啦啦,我只走 3 趟哟!</marquee> <P>
<marquee loop=3 width=50% behavior=alternate>啦啦啦,我只走 3 趟哟!</marquee>
啦啦啦,我只走 3 趟哟!
啦啦啦,我只走 3 趟哟!
啦啦啦,我只走 3 趟哟!
速度 <scrollamount=#>
<marquee scrollamount=20>啦啦啦,我走得好快哟!</marquee>啦啦啦,我走得好快哟!
延时 <scrolldelay=#>
<marquee scrolldelay=500 scrollamount=100>啦啦啦,我走一步,停一停!</marquee>啦啦啦,我走一步,停一停!
外观(Layout)设置
对齐方式(Align) <align=#> #=top, middle, bottom
<font size=6><marquee align=# width=400>啦啦啦,我会移动耶!</marquee>
</font>
对齐上沿、中间、下沿。
啦啦啦,我会移动耶!对齐上沿。
啦啦啦,我会移动耶!对齐中间。
啦啦啦,我会移动耶!对齐下沿。
底色 <bgcolor=#>
#=rrggbb 16 进制数码,或者是下列预定义色彩:Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua <marquee bgcolor=aaaaee>啦啦啦,我会移动耶!</marquee>
啦啦啦,我会移动耶!
面积 <height=# width=#>
<marquee height=40 width=50% bgcolor=aaeeaa>啦啦啦,我会移动耶!
</marquee>
啦啦啦,我会移动耶!
空白(Margins)<hspace=# vspace=#>
注:这两个属性主要是控制移动速度和移动间隔的。********************************************<br>
嗨,
<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle>啦啦啦,我会移动耶!</marquee>
大家好!<br>
这是在某不知名网页找到的一个非常生动的应用。
一般只需marqueebehavior="" scrollamount="" hspace="" width="" height="" onmouseover="this.stop();" onmouseout="this.start();" 这几个属性即可以做出非常正式的滚动公告了。例如:http://www.huaihongjiu.com/index.asp(酒源酒业)首页滚动公告栏,可以参考一下。
这是本人研究了一晚上之后的一点点小心得,希望能对各位有所帮助。欢迎一起探讨。
相关文章推荐
- ibnetfilter_queue
- subroutine has the same name with build_in functions
- TruePositive+FalsePostive & F-Measure
- UESTC 第五届ACM趣味程序设计竞赛第一场(热身赛,非原创题) 解题报告
- Android 应用程序窗体显示状态操作(requestWindowFeature()的应用)
- UIWindow & UIWindowLevel的应用引导
- UIButton
- UITableView
- 启用Confluence远程接口调用(Remote API)
- UISegmentedControl 开发笔记
- UITextView
- 带标签的break和continue(java基础)
- UITabBarController 隐藏
- C link table question
- DevSuite 研发管理工具支持需求、研发和质量的全面整合
- DWZ (JUI) 教程 navTab 刷新分析
- 精通UIPasteboard 粘贴板
- UITextField
- UIKit类继承图
- POJ 2853 Sequence Sum Possibilities