html浮动图片代码如何实现?

无恆 无恆 墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年,写一次发全网 我也要 + 加入社区
大家好,我想在网页里面制作很多浮动的小块儿。但是在网上找到很多代码都是设定了一个浮动的图片块儿。我想实现很多块在网页中漂浮。看了代码,还是不知道如何实现。下面是实现一个浮动漂浮块儿的代码:
(实现多个块的漂浮,应该怎么设置???谢谢!)
<div id="img" style="position:absolute; left:35px; top:556px; width:120; height:172">

<a href="/"qyml7.htm"> <img border="0" src="/"lo1.gif" width="140" height="120"></a></p>

</div>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

var xPos = 20;

var yPos = document.body.clientHeight;

var step = 1;

var delay = 30;

var height = 0;

var Hoffset = 0;

var Woffset = 0;

var yon = 0;

var xon = 0;

var pause = true;

var interval;

img.style.top = yPos;

function changePos() {

width = document.body.clientWidth;

height = document.body.clientHeight;

Hoffset = img.offsetHeight;

Woffset = img.offsetWidth;

img.style.left = xPos + document.body.scrollLeft;

img.style.top = yPos + document.body.scrollTop;

if (yon) {

yPos = yPos + step;

}

else {

yPos = yPos - step;

}

if (yPos < 0) {

yon = 1;

yPos = 0;

}

if (yPos >= (height - Hoffset)) {

yon = 0;

yPos = (height - Hoffset);

}

if (xon) {

xPos = xPos + step;

}

else {

xPos = xPos - step;

}

if (xPos < 0) {

xon = 1;

xPos = 0;

}

if (xPos >= (width - Woffset)) {

xon = 0;

xPos = (width - Woffset);

}

}

function start() {

img.visibility = "visible";

interval = setInterval('changePos()', delay);

}

start();

// End -->

</script>
...全文
评论 2
收藏 已收藏
分享
返回顶部
无恆
CSS 61,116 成员 60,701 内容