急求html代码,当鼠标移动到图片,图片停此滚动?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了急求html代码,当鼠标移动到图片,图片停此滚动?相关的知识,希望对你有一定的参考价值。
如何用滚动的图片链接到网站,请高手帮忙,谢谢!
下面的图片滚动代码仅用于html网页中,分别可以向上向下向左向右的滚动!把下面此代码插入html网页的<body>< /body>中就可以了!<!--下面是向上滚动代码-->
<div id=butong_net_top style=overflow:hidden;height:100;width:90;>
<div id=butong_net_top1>
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
</div>
<div id=butong_net_top2></div>
</div>
<script>
var speed=30 //这个是速度值越大速度越慢
butong_net_top2.innerHTML=butong_net_top1.innerHTML //克隆butong_net_top1为butong_net_top2
function Marquee1()
//当滚动至butong_net_top1与butong_net_top2交界时
if(butong_net_top2.offsetTop-butong_net_top.scrollTop<=0)
butong_net_top.scrollTop-=butong_net_top1.offsetHeight //butong_net_top跳到最顶端
else
butong_net_top.scrollTop++;
var MyMar1=setInterval(Marquee1,speed)//设置定时器
//鼠标移上时清除定时器达到滚动停止的目的
butong_net_top.onmouseover=function() clearInterval(MyMar1)
//鼠标移开时重设定时器
butong_net_top.onmouseout=function()MyMar1=setInterval(Marquee1,speed)
</script>
<!--向上滚动代码结束-->
<br>
<!--下面是向下滚动代码-->
<div id=butong_net_bottom style=overflow:hidden;height:100;width:90;>
<div id=butong_net_bottom1>
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
<img src="插入需要滚动的图片">
</div>
<div id=butong_net_bottom2></div>
</div>
<script>
var speed=30
butong_net_bottom2.innerHTML=butong_net_bottom1.innerHTML
butong_net_bottom.scrollTop=butong_net_bottom.scrollHeight
function Marquee2()
if(butong_net_bottom1.offsetTop-butong_net_bottom.scrollTop>=0)
butong_net_bottom.scrollTop+=butong_net_bottom2.offsetHeight
else
butong_net_bottom.scrollTop--
var MyMar2=setInterval(Marquee2,speed)
butong_net_bottom.onmouseover=function() clearInterval(MyMar2)
butong_net_bottom.onmouseout=function() MyMar2=setInterval(Marquee2,speed)
</script>
<!--向下滚动代码结束-->
<br>
<!--下面是向左滚动代码-->
<div id="butong_net_left" style="overflow:hidden;width:500px;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="butong_net_left1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="<img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
</tr>
</table>
</td>
<td id="butong_net_left2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=30//速度数值越大速度越慢
butong_net_left2.innerHTML=butong_net_left1.innerHTML
function Marquee3()
if(butong_net_left2.offsetWidth-butong_net_left.scrollLeft<=0)
butong_net_left.scrollLeft-=butong_net_left1.offsetWidth
else
butong_net_left.scrollLeft++
var MyMar3=setInterval(Marquee3,speed)
butong_net_left.onmouseover=function() clearInterval(MyMar3)
butong_net_left.onmouseout=function() MyMar3=setInterval(Marquee3,speed)
</script>
<!--向左滚动代码结束-->
<br>
<!--下面是向右滚动代码-->
<div id="butong_net_right" style="overflow:hidden;width:500px;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="butong_net_right1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
<td><img src="插入需要滚动的图片"></td>
</tr>
</table>
</td>
<td id="butong_net_right2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=30//速度数值越大速度越慢
butong_net_right2.innerHTML=butong_net_right1.innerHTML
function Marquee4()
if(butong_net_right.scrollLeft<=0)
butong_net_right.scrollLeft+=butong_net_right2.offsetWidth
else
butong_net_right.scrollLeft--
var MyMar4=setInterval(Marquee4,speed)
butong_net_right.onmouseover=function() clearInterval(MyMar4)
butong_net_right.onmouseout=function() MyMar4=setInterval(Marquee4,speed)
</script>
<!--向右滚动代码结束-->
如果你只需要移上去停止,移走就动的话就用这句
<marquee onmouseover="this.stop();" onMouseOut="this.start();" scrollamount="1" scrolldelay="85" direction="up" behavior="scroll" height="40" width="400">
要滚动的图片
</marquee>
图片上加链接和你给文字加链接是一样的 参考技术A 在你滚动的图片前面加一个<a></a>标签
<a href="这里面放要连接的网站"><img src="插入需要滚动的图片"></a>
实例 以下数据为假数据,请你更改你自己的真实数据
<a href="hao.html"><img src="img/hao.jpg"></a>
以上是关于急求html代码,当鼠标移动到图片,图片停此滚动?的主要内容,如果未能解决你的问题,请参考以下文章