在html中如何让插入的图片来回移动？_IT百科

在html中需要将插入的图片左右来回移动，只需要在图片img标签外套一个marquee标签，在里面写上behavior=alternate这句话就可以实现。\x0d\x0a alternate是滚动标签的属性。\x0d\x0ascrolldelay，滚动延时，用于设定两次滚动 *** 作之间的间隔时间，该时间以毫秒为单位。\x0d\x0abehavior，滚动方式。\x0d\x0a\x0d\x0aalternate：表示在两端之间来回滚动。\x0d\x0ascroll：表示由一端滚动到另一端，会重复。\x0d\x0aslide：表示由一端滚动到另一端，不会重复

分类: 电脑/网络 >>程序设计 >>其他编程语言

问题描述:

用JS也可以..主要是可以无间隙循环滚动就可以了

如果是JS再请说明一下使用方法..

小弟刚入门..什么都不懂..谢谢了.

解析:

Set slideShowSpeed (milliseconds)

var slideShowSpeed = 5000

Duration of crossfade (seconds)

var crossFadeDuration = 3

Specify the image files

var Pic = new Array()

to add more images, just continue

the pattern, adding to the array below

Pic[0] = 'images2005/03/1.gif' 图片路径

Pic[1] = 'images2005/03/2.gif'

Pic[2] = 'images2005/03/3.gif'

Pic[3] = 'images2005/03/4.gif'

Pic[4] = 'images2005/03/5.gif'

Pic[5] = 'images2005/03/6.gif'

Pic[6] = 'images2005/03/7.gif'

Pic[7] = 'images2005/03/8.gif'

Pic[8] = 'images2005/03/9.gif'

Pic[9] = 'images2005/03/10.gif'

do not edit anything below this line

var t

var j = 0

var p = Pic.length

var preLoad = new Array()

for (i = 0i <pi++) {

preLoad = new Image()

preLoad.src = Pic

}

function runSlideShow() {

if (document.all) {

document.images.SlideShow.style.filter="blendTrans(duration=2)"

document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"

document.images.SlideShow.filters.blendTrans.Apply()

}

document.images.SlideShow.src = preLoad[j].src

if (document.all) {

document.images.SlideShow.filters.blendTrans.Play()

}

j = j + 1

if (j >(p - 1)) j = 0

t = setTimeout('runSlideShow()', slideShowSpeed)

}

</SCRIPT>

将BODY改为 <BODY onload=runSlideShow()>

1、新建一个文件夹，用来存放网页文件和图片，快捷键ctrl+shift+n。

2、进入新建文件夹里面，右键新建文本文档。

3、进入新建的文本文档，复制下方代码，点击快捷键ctrl+s保存后退出。

<!doctype html>

<html>

<head>

</head>

<body>

<!--

position:fixed是设置为固定在页面的某个位置，不会随滚动条滚动而移动。

top: 50px图片距离页面顶部50像素。

right:10px图片距离页面右边10像素。

display:block设置图片为块状元素，这样图片不会单独占据行-->

百度知道百度知道百度知道百度知道百度知道百度知道

</body>

</html>

4、重命名新建文本文档为index.html，原先的.txt的后缀同时去掉后保存，提示确实要更改后按“是”即可。

5、添加背景图片源文件，并命名为1.png，这些图片为你需要放置的图片。

6、点击index.html，右键浏览器打开预览效果。

7、浏览器打开后即可得到如下效果

欢迎分享，转载请注明来源：内存溢出

原文地址: https://outofmemory.cn/bake/11477692.html

在html中如何让插入的图片来回移动？

发表评论

评论列表（0条）