html中怎样定时变换背景图片

html中怎样定时变换背景图片,第1张

一般是用脚本实现。示例:<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style type="text/css">#bg_body{background:url(1.jpg) no-repeat center #eee background-attachment:fixed height:1000px}</style><script type="text/javascript">window.onload=function(){var oBody=document.getElementById('bg_body') var oS=oBody.style function BgChenge(){oS.backgroundImage='url(2.jpg)' } function BgPosition(){oS.backgroundRepeat='no-repeat' oS.backgroundPosition='center' oS.backgroundAttachment='fixed' } function LoadMethod(){BgChenge() BgPosition()} setInterval(LoadMethod,1000)}</script></head><body id="bg_body"></body></html>你背景图片就设置了一个2.jpg再切换也是这一张图片啊如果有多张图片比如说1-10.jpg,那就把oS.backgroundImage='url(2.jpg)'改为oS.backgroundImage='url('+(parseInt(Math.random() * 10) + 1)+'.jpg)'

这中情况有很多,第一种可能是的脚本函数有问题,你首先在函数的第一行alert一下,看是否触发了这函数,如果出发,那么就可能是第二种问题,那么就是你函数在执行过程中存在问题,那么在每一行的后面都alert看一是错在那一行。如果这还没有问题那么就可能是你的所给的id元素更不不存在或者你在拼接url的时候拼错了,目前只能看出这么多,你代码有限。如何还有问题可以密我

网页背景图片设置:

(平铺背景图片)

<body background=d:\image\石家庄.jpg

或者

<body style=background-image: url(d:\image\石家庄.jpg)

(背景图片不重复)

<body style=background-image: url(d:\image\石家庄.jpg) no-repeat

(背景图片居中不重复)

<body style=background-image: url(d:\image\石家庄.jpg) no-repeat 50% 0

注释:

style 后双引号部分为CSS样式;

background-image:url(图片路径) 为背景图片

no-repeat 不重复;

50% 0 即(水平位置 垂直位置) 水平50%既居中,垂直0px;

把里面的图片位置换成你的就行了,例子里面是绝对地址,像网站一般用相对地址,就是相对你要设置的网页的地址


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7275483.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存