- ·上一篇文章:动态生成的checkbox表单的检测
- ·下一篇文章:利用javascript实现QQ客服代码
当前位置:K88软件开发 → 文章中心 → 编程语言 → JavaScript → JS01 → 文章内容
不断滚动的新闻代码
<
style>
.dhMarquee 
{width:100px
height:108px
text-align:left
margin:0px
padding:0px
border:1px 
solid 
#000
overflow:hidden
white-space:nowrap
} 
.mqdemo 
{margin:0px
padding:0px
border:0px
}
.dhScrollA 
{font-size:12px
display:block
padding:2px
}
<
/style>
 
<
div 
id="
mq"
 
class="
dhMarquee"
 
onmouseover="
iScrollAmount=0"
 
onmouseout="
iScrollAmount=1"
>
<
div 
id="
mqdemo"
 
class="
mqdemo"
>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
1&
#39
)"
>
月圆之夜1<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
2&
#39
)"
>
紫禁之颠2<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
3&
#39
)"
>
西门吹雪3<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
4&
#39
)"
>
天外飞仙4<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
5&
#39
)"
>
太阳之夜5<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
6&
#39
)"
>
紫禁之谷6<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
7&
#39
)"
>
西门吹风7<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
8&
#39
)"
>
天外飞碟8<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
1&
#39
)"
>
月圆之夜9<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
2&
#39
)"
>
紫禁之颠10<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
3&
#39
)"
>
西门吹雪11<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
4&
#39
)"
>
天外飞仙12<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
5&
#39
)"
>
太阳之夜13<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
6&
#39
)"
>
紫禁之谷14<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
7&
#39
)"
>
西门吹风15<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
8&
#39
)"
>
天外飞碟16<
/a>
<
/div>
<
/div>
<
script 
language="
javascript"
>
 
var 
speed 
= 
30
 
//滚动对象 
var 
oMarquee 
= 
document.getElementById("
mq"
)
//内容对象 
var 
omqdemo 
= 
document.getElementById("
mqdemo"
)
var 
h 
= 
oMarquee.offsetHeight
var 
odl 
= 
omqdemo.offsetHeight
var 
x 
= 
parseInt(h/odl)+1
for(var 
i=0
i<
x
i++)
{
var 
o 
= 
omqdemo.cloneNode(true)
oMarquee.appendChild(o)
}
var 
iScrollAmount 
= 
1
var 
myMar
function 
scroll()
{
oMarquee.scrollTop 
+= 
iScrollAmount
var 
ol 
= 
oMarquee.scrollTop
if(odl-ol<
=0)
{
window.clearTimeout(myMar)
oMarquee.scrollTop 
= 
0
}else
{
if(ol%h!=0)
{
myMar 
= 
window.setTimeout(scroll,speed)
}else
{
window.clearTimeout(myMar)
}
}
}
var 
t 
= 
6000
function 
clipShow()
{
scroll()
window.setTimeout(clipShow,t)
}
window.setTimeout(clipShow,t)
<
/script>
style>
.dhMarquee 
{width:100px
height:108px
text-align:left
margin:0px
padding:0px
border:1px 
solid 
#000
overflow:hidden
white-space:nowrap
} 
.mqdemo 
{margin:0px
padding:0px
border:0px
}
.dhScrollA 
{font-size:12px
display:block
padding:2px
}
<
/style>
 
<
div 
id="
mq"
 
class="
dhMarquee"
 
onmouseover="
iScrollAmount=0"
 
onmouseout="
iScrollAmount=1"
>
<
div 
id="
mqdemo"
 
class="
mqdemo"
>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
1&
#39
)"
>
月圆之夜1<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
2&
#39
)"
>
紫禁之颠2<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
3&
#39
)"
>
西门吹雪3<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
4&
#39
)"
>
天外飞仙4<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
5&
#39
)"
>
太阳之夜5<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
6&
#39
)"
>
紫禁之谷6<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
7&
#39
)"
>
西门吹风7<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
8&
#39
)"
>
天外飞碟8<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
1&
#39
)"
>
月圆之夜9<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
2&
#39
)"
>
紫禁之颠10<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
3&
#39
)"
>
西门吹雪11<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
4&
#39
)"
>
天外飞仙12<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
5&
#39
)"
>
太阳之夜13<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
6&
#39
)"
>
紫禁之谷14<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
7&
#39
)"
>
西门吹风15<
/a>
<
a 
class="
dhScrollA"
 
href="
javascript:alert(&
#39
8&
#39
)"
>
天外飞碟16<
/a>
<
/div>
<
/div>
<
script 
language="
javascript"
>
 
var 
speed 
= 
30
 
//滚动对象 
var 
oMarquee 
= 
document.getElementById("
mq"
)
//内容对象 
var 
omqdemo 
= 
document.getElementById("
mqdemo"
)
var 
h 
= 
oMarquee.offsetHeight
var 
odl 
= 
omqdemo.offsetHeight
var 
x 
= 
parseInt(h/odl)+1
for(var 
i=0
i<
x
i++)
{
var 
o 
= 
omqdemo.cloneNode(true)
oMarquee.appendChild(o)
}
var 
iScrollAmount 
= 
1
var 
myMar
function 
scroll()
{
oMarquee.scrollTop 
+= 
iScrollAmount
var 
ol 
= 
oMarquee.scrollTop
if(odl-ol<
=0)
{
window.clearTimeout(myMar)
oMarquee.scrollTop 
= 
0
}else
{
if(ol%h!=0)
{
myMar 
= 
window.setTimeout(scroll,speed)
}else
{
window.clearTimeout(myMar)
}
}
}
var 
t 
= 
6000
function 
clipShow()
{
scroll()
window.setTimeout(clipShow,t)
}
window.setTimeout(clipShow,t)
<
/script>
不断滚动的新闻代码