zoukankan
html css js c++ java
Marquee 连续滚动
在网上搜了一下几乎是同一个版本的连续滚动。并且有一些问题
于是就自己写了一个
<
div id
=
"
Parent
"
style
=
"
cursor: hand; overflow: hidden; 800px; height:50px
"
>
<
div id
=
"
Child_A
"
style
=
"
float:left;white-space:nowrap;
"
><
a href
=
"
http://lookcode.net
"
>
lookcode
</
a
>
<
a href
=
"
http://www.searoute.net
"
>
searoute
</
a
>
</
div
>
</
div
>
<
span id
=
"
spanMsg
"
></
span
>
<
script type
=
"
text/javascript
"
>
var Parent
=
document.getElementById(
"
Parent
"
);
var ChildA
=
document.getElementById(
"
Child_A
"
);
var parentWidth
=
800
;
var count
=
2
;
ChildA.innerHTML
=
ChildA.innerHTML
+
"
"
+
ChildA.innerHTML;
while
(Parent.scrollWidth
<=
parentWidth)
{
count
*=
2
;
ChildA.innerHTML
=
ChildA.innerHTML
+
"
"
+
ChildA.innerHTML;
}
var speed
=
10
;
function Marquee()
{
if
(ChildA.offsetWidth
/
count
-
Parent.scrollLeft
<
0
)
//
NB Cacluate the optimal position
{
Parent.scrollLeft
-=
ChildA.offsetWidth
/
count;
}
else
{
Parent.scrollLeft
++
}
}
var MyMar
=
setInterval(Marquee,speed)
Parent.onmouseover
=
function()
{clearInterval(MyMar)}
Parent.onmouseout
=
function()
{MyMar
=
setInterval(Marquee,speed)}
</
script
>
----write by lovebanyi 风云---
主要的是思想是利用滚条动。所以我们需要两个element 并且我们代码一定得让它产生滚动条。就是对同一个文本进行多次复制 这样子就OK了
第二就是计算出 重新开始的位置
把overflow设成scroll 这样就可以看到滚动条的效果了。 对spanMsg进行赋值可以观察
第四可以跟据代码做成你自己需要的向左向右向上向下。的代码
查看全文
相关阅读:
Discuz的sc 和tc版本有什么区别
使用Word2010发布博客到博客园
如何快速产生流量,流量精灵使用方法
XP系统如何把桌面图标变大
打印机后台程序没有运行怎么办
CF无法全屏怎么办
XP如何找到网上邻居
P2P终结者和反P2P终结者如何使用
PortableApps的使用方法
JavaScript,JS如何控制input输入字符限制
原文地址:https://www.cnblogs.com/lovebanyi/p/904458.html
最新文章
2星|《读懂你的客户:基于大数据的消费者战略》:资料引用与堆砌,缺乏自己的见解
2星|陈九霖《商业的逻辑》:曾经入狱的中航油(新加坡)掌门人的商业感想
java 图像分析与处理库
android中向bitmap里写入文字
java识别文件或字符串的编码格式
车宝·杀菌王和光触媒可除新车气味
Android“This Handler class should be static or leaks might occur”警告的处理方法
自动帮助创建android资源xml文件的网站
用java获取歌曲文件的专辑封面元信息
linux下改变文件的字符编码
热门文章
制作java可执行程序的方法
优秀android开源项目与解决方案推荐
SSO是什么?
PHPWIND和DISCUZ什么区别?
如何去掉显卡的桌面右键菜单:
Php优化方案
PHP中静态方法(static)与非静态方法的使用及区别
如何设置mysql登陆密码?
如何更改删除window服务?
httpd: Could not reliably determine the server's fully qualified domain name
Copyright © 2011-2022 走看看