首页添加漂浮方法
更新时间:2021-03-08 09:04:11 访问量:
找到首页模板文件,index.html
在body里面加入代码,根据图片的尺寸和路径修改一下以下的数值就可以了,样式可以根据实际情况调一下
<div id="img" style="width:381px; height:218px;position:absolute;z-index:9999;" onMouseOver="mystop()" onMouseOut="start()">
<div id="close-ad" style="width:50px;height:15px;float:left; display:inline;cursor:pointer;color:#000000;text-align:left;" onClick="closead()">关闭</div>
<div style="width:400px;height:218px;"><a href="#" target="_blank"><img src="飘窗3.jpg" border="0"/></a></div>
</div>
<script type="text/javascript">
var xPos = 0;var yPos = 0; var step = 1;var delay = 30;var height = 0; var Hoffset = 0;var Woffset = 0; var yon = 0;var xon = 0; var xon = 0; var interval;
var imgWindow = document.getElementById('img');
img.style.top = 0;
var interval;
function changePos(){
width = document.body.clientWidth;
height = document.documentElement.clientHeight;
Hoffset = imgWindow.offsetHeight;
Woffset = imgWindow.offsetWidth;
imgWindow.style.left = xPos + document.body.scrollLeft + "px";
imgWindow.style.top = yPos + document.body.scrollTop + "px";
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() {
imgWindow.visibility = 'visible';
interval = setInterval('changePos()', delay);
}
function mystop()
{
clearInterval(interval);
}
function closead(){
clearInterval(interval);
imgWindow.style.display = "none";
return false;
}
start();
</script>
</body>
</html>
<script type="text/javascript">
var navid ="0";
</script>