当前位置:首页 > 代码 > 正文

图片向左循环滚动代码(图片左右滚动代码)

admin 发布:2022-12-19 16:49 131


今天给各位分享图片向左循环滚动代码的知识,其中也会对图片左右滚动代码进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!

本文目录一览:

图片不间断循环滚动代码(向左,向右,向上,向下)

//向左滚动script

var

speed=30

//滚动速度demo2.innerHTML=demo1.innerHTML

//滚动区域function

Marquee(){

//实现滚动的方法if(demo2.offsetWidth-demo.scrollLeft=0)

demo.scrollLeft-=demo1.offsetWidth

else{

demo.scrollLeft++

//向左}

}

var

MyMar=setInterval(Marquee,speed)

demo.onmouseover=function()

{clearInterval(MyMar)}

demo.onmouseout=function()

{MyMar=setInterval(Marquee,speed)}

/script//向右滚动,其实代码差不多,就一个地方不一样script

var

speed=30

demo2.innerHTML=demo1.innerHTML

demo.scrollLeft=demo.scrollWidth

function

Marquee(){

if(demo.scrollLeft=0)

demo.scrollLeft+=demo2.offsetWidth

else{

demo.scrollLeft--

//向右}

}

var

MyMar=setInterval(Marquee,speed)

demo.onmouseover=function()

{clearInterval(MyMar)}

demo.onmouseout=function()

{MyMar=setInterval(Marquee,speed)}

/script

下面2个就是

上下的了script

var

speed=50

demo2.innerHTML=demo1.innerHTML

function

Marquee(){

if(demo2.offsetTop-demo.scrollTop=0)

demo.scrollTop-=demo1.offsetHeight

else{

demo.scrollTop++

}

}

var

MyMar=setInterval(Marquee,speed)

demo.onmouseover=function()

{clearInterval(MyMar)}

demo.onmouseout=function()

{MyMar=setInterval(Marquee,speed)}

/script

script

var

speed=30

demo2.innerHTML=demo1.innerHTML

demo.scrollTop=demo.scrollHeight

function

Marquee(){

if(demo1.offsetTop-demo.scrollTop=0)

demo.scrollTop+=demo2.offsetHeight

else{

demo.scrollTop--

}

}

var

MyMar=setInterval(Marquee,speed)

demo.onmouseover=function()

{clearInterval(MyMar)}

demo.onmouseout=function()

{MyMar=setInterval(Marquee,speed)}

/script

在图片上加连接

图片

在HTML里图片从右到左循环滚动。而且不间断的。是什么写

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " " html xmlns=" " head title new document /title meta name="generator" content="editplus" / meta name="author" content="" / meta name="keywords" content="" / meta name="description" content="" / /head body div id="marquee_demo" style="overflow:hidden;width:100%;text-align:center;border:1px solid #0066cc" table cellspacing="0" cellpadding="3" align="center" border="0" tr td id="marquee_product1" valign="top" table width="100%" height="100" border="0" cellpadding="2" cellspacing="0" tr tda href=" "img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td tda href=" "img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td tda href=" "img src=" " border=0/a/td tda href="/"img src=" " border=0/a/td /tr /table /td td id="marquee_product2" valign="top"/td /tr /table /div script type="text/javascript" var speed=30; marquee_product2.innerHTML=marquee_product1.innerHTML; function Marquee(){ if(marquee_demo.scrollRight=marquee_product1.scrollWidth){ marquee_demo.scrollLeft=0; } else{ marquee_demo.scrollLeft++; } } var MyMar=setInterval(Marquee,speed); marquee_demo.onmouseover=function(){clearInterval(MyMar);} marquee_demo.onmouseout=function(){MyMar=setInterval(Marquee,speed);} /script /body /html

求一ASP网页图片循环滚动代码?

div id="c_9"

marquee direction="left" TrueSpeed scrollamount="1" scrolldelay="30" onMouseOver="this.stop();" onMouseOut="this.start();"

img src="images/p_0/p_1.jpg" width="150" height="130" border="1" /

img src="images/p_0/p_2.jpg" width="150" height="130" border="1" /

img src="images/p_0/p_3.jpg" width="150" height="130" border="1" /

/marquee

/div

附:循环滚动基本语法

marquee ... /marquee

移动属性的设置 ,这种移动不仅仅局限于文字,也可以应用于图片,表格等等

方向

direction=# #=left, right ,up ,down marquee direction=left从右向左移!/marquee

方式

bihavior=# #=scroll, slide, alternate marquee behavior=scroll一圈一圈绕着走!/marquee

marquee behavior=slide只走一次就歇了!/marquee

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

marquee loop=3 width=50% behavior=alternate只走 3 趟!/marquee

速度

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=#

marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle面积!/marquee

图片连续循环滚动代码

图片连续循环滚动代码(向上、下、左、右) 向上:

base

href=""

div id=demo style="overflow:hidden; width:128px; height:300px;"

div id=demo1

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

/div

div id=demo2/div

/div

script language="javascript"

var speed=30

demo2.innerHTML=demo1.innerHTML

function Marquee(){

if(demo2.offsetTop-demo.scrollTop=0)

demo.scrollTop-=demo1.offsetHeight

else{

demo.scrollTop++

}

}

var MyMar=setInterval(Marquee,speed)

demo.onmouseover=function() {clearInterval(MyMar)}

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

/script

向下:

base

href=""

div id=demo style="overflow:hidden; width:128px; height:300px;"

div id=demo1

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

img src="gfjs.gif"brimg src="bxtt.gif"brimg src="bzjd.gif"br

/div

div id=demo2/div

/div

script language="javascript"

var speed=30

demo2.innerHTML=demo1.innerHTML

demo.scrollTop=demo.scrollHeight

function Marquee(){

if(demo1.offsetTop-demo.scrollTop=0)

demo.scrollTop+=demo2.offsetHeight

else{

demo.scrollTop--

}

}

var MyMar=setInterval(Marquee,speed)

demo.onmouseover=function() {clearInterval(MyMar)}

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

/script

向左:

base

href=""

div id=demo style="overflow:hidden;height:100px;width:300px;"table align=left

cellpadding=0 cellspace=0 border=0trtd id=demo1 valign=topimg src="gfjs.gif"img

src="bxtt.gif"img src="bzjd.gif"img src="gfjs.gif"img src="bxtt.gif"img

src="bzjd.gif"/tdtd id=demo2 valign=top/td/tr/table/div

script

var speed=30

demo2.innerHTML=demo1.innerHTML

function Marquee(){

if(demo2.offsetWidth-demo.scrollLeft=0)

demo.scrollLeft-=demo1.offsetWidth

else{

demo.scrollLeft++

}

}

var MyMar=setInterval(Marquee,speed)

demo.onmouseover=function() {clearInterval(MyMar)}

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

/script

向右:

base

href=""

div id=demo style="overflow:hidden;height:100px;width:300px;"table align=left

cellpadding=0 cellspace=0 border=0trtd id=demo1 valign=topimg src="gfjs.gif"img

src="bxtt.gif"img src="bzjd.gif"img src="gfjs.gif"img src="bxtt.gif"img

src="bzjd.gif"/tdtd id=demo2 valign=top/td/tr/table/div

script

var speed=30

demo2.innerHTML=demo1.innerHTML

demo.scrollLeft=demo.scrollWidth

function Marquee(){

if(demo.scrollLeft=0)

demo.scrollLeft+=demo2.offsetWidth

else{

demo.scrollLeft--

}

}

var MyMar=setInterval(Marquee,speed)

demo.onmouseover=function() {clearInterval(MyMar)}

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

/script

html

body

/body

/html

悬赏50分ASP:循环滚动图片的代码请解释

marquee标签是很方便,但要实现不间断的滚动确比较麻烦.

楼主的这段是网上很经典的滚动代码,我斗胆以个人理解做个注释:

offsetWidth是指物体可见宽度

scrollLeft是指滚动滑块在滚动条上的位置

!--对于此例,网页中一般会有三个容器,此处为demo,demo1和demo2;其中demo1和demo2均在demo中

demo的overflow属性一般为hidden,我在这里用auto是为了方便你查看scrollLeft的状态,

另外为方便你理解scrollLeft和offsetWidth,我还在后面加了一个viewstatus函数,鼠标经过容器时会看到相关参数值

//--

div id=demo style="width:200;overflow:auto"

tabletr

td id=demo1

img src='a.gif' width=100img src='b.gif' width=100/td

td id=demo2/td

/tr/table

/div

script

var speed=30 //定义速度,实指下面滚动函数的执行间隔,值越小滚动越快

demo2.innerHTML=demo1.innerHTML //将demo1中的内容复制到demo2

function Marquee(){ //开始定义滚动函数

if(demo2.offsetWidth-demo.scrollLeft=0)

demo.scrollLeft-=demo1.offsetWidth //如果滑动块的位置大于demo2的宽度,滑动块退回一个demo2的宽度

else{

demo.scrollLeft++ //否则,滑动块向右滚动(图片向左滚)

}

}//滚动函数定义完

var MyMar=setInterval(Marquee,speed) //设置定时器,使滚动函数每30毫秒运行一次

demo.onmouseover=function() {clearInterval(MyMar);viewstatus();}//鼠标经过时,清除定时器,停止执行滚动函数,弹出信息;

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}// 鼠标离开后,继续滚动

function viewstatus(){//这是我加的函数,很简单,不注释了

mess="demo.scrollLeft:"+demo.scrollLeft+"\ndemo1.offsetWidth:"+demo1.offsetWidth+"\ndemo2.offsetWidth:"+demo2.offsetWidth;

alert(mess);

}

/script

我也花了好久时间才算弄明白(自以为是明白,呵呵),不知理解的对不对.

还请高手指教.

图片向左循环滚动代码的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于图片左右滚动代码、图片向左循环滚动代码的信息别忘了在本站进行查找喔。

版权说明:如非注明,本站文章均为 AH站长 原创,转载请注明出处和附带本文链接;

本文地址:http://ahzz.com.cn/post/13987.html


取消回复欢迎 发表评论:

分享到

温馨提示

下载成功了么?或者链接失效了?

联系我们反馈

立即下载