问题，关于网页特效的！

goodask 2001-10-05 02:21:40
图片运动的特效，代码如下：

<html>
<head>
<title>qq</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">


<!-- 代码1开始处 -->

<script language="JavaScript">
var isNS = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4));
var _all = '';
var _style = '';
var wwidth, wheight;
var ydir = '++';
var xdir = '++';
var id1, id2, id3;
var x = 1;
var y = 1;
var x1, y1;
if(!isNS) {
_all='all.';
_style='.style';
}
function getwindowsize() {
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
if (isNS) {
wwidth = window.innerWidth - 55;
wheight = window.innerHeight - 50;
} else {
wwidth = document.body.clientWidth - 55;
wheight = document.body.clientHeight - 50;
}
id3 = setTimeout('randomdir()', 20000);
animate();
}
function randomdir() {
if (Math.floor(Math.random()*2)) {
(Math.floor(Math.random()*2)) ? xdir='--': xdir='++';
} else {
(Math.floor(Math.random()*2)) ? ydir='--': ydir='++';
}
id2 = setTimeout('randomdir()', 20000);
}
function animate() {
eval('x'+xdir);
eval('y'+ydir);
if (isNS) {
pic1.moveTo((x+pageXOffset),(y+pageYOffset))
} else {
pic1.pixelLeft = x+document.body.scrollLeft;
pic1.pixelTop = y+document.body.scrollTop;
}
if (isNS) {
if (pic1.top <= 5+pageYOffset) ydir = '++';
if (pic1.top >= wheight+pageYOffset) ydir = '--';
if (pic1.left >= wwidth+pageXOffset) xdir = '--';
if (pic1.left <= 5+pageXOffset) xdir = '++';
} else {
if (pic1.pixelTop <= 5+document.body.scrollTop) ydir = '++';
if (pic1.pixelTop >= wheight+document.body.scrollTop) ydir = '--';
if (pic1.pixelLeft >= wwidth+document.body.scrollLeft) xdir = '--';
if (pic1.pixelLeft <= 5+document.body.scrollLeft) xdir = '++';
}
id1 = setTimeout('animate()', 30);
}

// -->
</script>

<!-- 代码1结束处 -->

</head>

<body bgcolor="#FFFFFF" OnLoad="getwindowsize()" OnResize="getwindowsize()">


<!-- 代码2开始处 -->

<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<a href="http://www.qq.com/opo/" target="_blank"><img src="opo.jpg" border="0"></a>
</div>
<script language="javascript">
var pic1=eval('document.'+_all+'pic1'+_style);
</script>

<!-- 代码2结束处 -->


</body></html>


出来的图片在最底层飘啊飘，图片及文字在上，如何解决啊，我要它好似其这它网页飘在最上面啊！？
...全文
79 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
goodask 2001-10-06
  • 打赏
  • 举报
 回复
有谁知道啊！
goodask 2001-10-05
  • 打赏
  • 举报
 回复
把它改成10，可以啊，谢谢！
daoke(该怎么样，就怎么样吧~~~~) ，copy它，用dw试一试啊！
help!
goodask 2001-10-05
  • 打赏
  • 举报
 回复
<html>
<head>
<title>qq</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">


<!-- 代码1开始处 -->

<script language="JavaScript">
<!--
var isNS = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4));
var _all = '';
var _style = '';
var wwidth, wheight;
var ydir = '++';
var xdir = '++';
var id1, id2, id3;
var x = 1;
var y = 1;
var x1, y1;
if(!isNS) {
_all='all.';
_style='.style';
}
function getwindowsize() {
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
if (isNS) {
wwidth = window.innerWidth - 55;
wheight = window.innerHeight - 50;
} else {
wwidth = document.body.clientWidth - 55;
wheight = document.body.clientHeight - 50;
}
id3 = setTimeout('randomdir()', 20000);
animate();
}
function randomdir() {
if (Math.floor(Math.random()*2)) {
(Math.floor(Math.random()*2)) ? xdir='--': xdir='++';
} else {
(Math.floor(Math.random()*2)) ? ydir='--': ydir='++';
}
id2 = setTimeout('randomdir()', 20000);
}
function animate() {
eval('x'+xdir);
eval('y'+ydir);
if (isNS) {
pic1.moveTo((x+pageXOffset),(y+pageYOffset))
} else {
pic1.pixelLeft = x+document.body.scrollLeft;
pic1.pixelTop = y+document.body.scrollTop;
}
if (isNS) {
if (pic1.top <= 5+pageYOffset) ydir = '++';
if (pic1.top >= wheight+pageYOffset) ydir = '--';
if (pic1.left >= wwidth+pageXOffset) xdir = '--';
if (pic1.left <= 5+pageXOffset) xdir = '++';
} else {
if (pic1.pixelTop <= 5+document.body.scrollTop) ydir = '++';
if (pic1.pixelTop >= wheight+document.body.scrollTop) ydir = '--';
if (pic1.pixelLeft >= wwidth+document.body.scrollLeft) xdir = '--';
if (pic1.pixelLeft <= 5+document.body.scrollLeft) xdir = '++';
}
id1 = setTimeout('animate()', 30);
}

// -->

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

<!-- 代码1结束处 -->

</head>

<body bgcolor="#FFFFFF" OnLoad="getwindowsize();MM_preloadImages('../image/p4_r2_c2.gif','../image/5.gif','../image/1.gif')" OnResize="getwindowsize()">
<!-- 代码2开始处 -->
<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:10">
<a href="http://www.qq.com/opo/" target="_blank"><img src="opo.jpg" border="0"></a>
</div>
<script language="javascript">
var pic1=eval('document.'+_all+'pic1'+_style);
</script>
<!-- 代码2结束处 -->
<div id='KB4Child' class='child'> </div>
<table width="758" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td><img src="../image/b1.gif" width="300" height="56"></td>
<td><img src="../image/banner.gif" width="424" height="56"></td>
</tr>
</table>
<br>
<table width="758" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="121" height="2"> </td>
<td width="137" align="center" height="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','../image/p4_r2_c2.gif',1)"><img name="Image6" border="0" src="../image/p3_r2_c2.gif" width="86" height="23"></a></td>
<td width="132" align="center" height="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image15','','../image/5.gif',1)"><img name="Image15" border="0" src="../image/6.gif" width="88" height="22"></a></td>
<td width="140" align="center" height="2">
<table width="87" border="0" cellspacing="0" cellpadding="0" height="29" bgcolor="cce6ff">
<tr>
<td><img src="../image/4.gif" width="88" height="22"></td>
</tr>
</table>
</td>
<td width="118" align="center" height="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image17','','../image/1.gif',1)"><img name="Image17" border="0" src="../image/2.gif" width="88" height="22"></a>
</td>
<td width="110" height="2"> </td>
</tr>
<tr bgcolor="cce6ff">
<td width="121"> </td>
<td width="137"> </td>
<td width="132"> </td>
<td width="140" bgcolor="cce6ff"> </td>
<td width="118"> </td>
<td width="110"> </td>
</tr>
</table>
<script>numTotal=5;scores[1]='KB1';scores[2]='KB1';scores[3]='KB2';scores[4]='KB3';scores[5]='KB4';</script>

<script language="JavaScript1.2">
scores = new Array(20);var numTotal=0;NS4 = (document.layers) ? 1 : 0;IE4 = (document.all) ? 1 : 0;ver4 = (NS4 || IE4) ? 1 : 0;if (ver4) { with (document) { write("<STYLE TYPE='text/css'>"); if (NS4) { write(".parent {position:absolute; visibility:visible}"); write(".child {position:absolute; visibility:visible}"); write(".regular {position:absolute; visibility:visible}") } else { write(".child {display:none}") } write("</STYLE>"); }}function getIndex(el) { ind = null; for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id == el) { ind = i; break; } } return ind;}function arrange() { nextY = document.layers[firstInd].pageY +document.layers[firstInd].document.height; for (i=firstInd+1; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.visibility != "hide") { whichEl.pageY = nextY; nextY += whichEl.document.height; } }}function initIt(){ if (!ver4) return; if (NS4) { for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide"; } arrange(); } else { divColl = document.all.tags("DIV"); for (i=0; i<divColl.length; i++) { whichEl = divColl(i); if (whichEl.className == "child") whichEl.style.display = "none"; } }}function expandIt(el) { if (!ver4) return; if (IE4) { whichEl1 = eval(el + "Child"); for(i=1;i<=numTotal;i++){ whichEl = eval(scores[i] + "Child"); if(whichEl!=whichEl1) { whichEl.style.display = "none"; } } whichEl1 = eval(el + "Child"); if (whichEl1.style.display == "none") { whichEl1.style.display = "block"; } else { whichEl1.style.display = "none"; } } else { whichEl = eval("document." + el + "Child"); for(i=1;i<=numTotal;i++){ whichEl = eval("document." + scores[i] + "Child"); if(whichEl!=whichEl1) { whichEl.visibility = "hide"; } } if (whichEl.visibility == "hide") { whichEl.visibility = "show"; } else { whichEl.visibility = "hide"; } arrange(); }}onload = initIt;

//--这是左边导航栏的js代码>
</script>

<br>
<table width="758" border="1" cellspacing="0" cellpadding="0" align="center" bordercolor="cce6ff">
<tr>
<td width="102" height="556" bgcolor="cce6ff" align="center" valign="top">
<a href="#" onClick="expandIt('KB1'); return false"> </a>
<table width="85" border="0" cellspacing="0" cellpadding="0" height="298" align="center">
<tr>
<td height="252" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" onClick="expandIt('KB1'); return false"><img src='../image/07.gif' border=0 width="90" height="32"></a>
<div id='KB1Child' class='child'> <a href='product1.htm'> <img src='../image/00.gif' border=0 width="85" height="28"></a><br>
<a href='product3.htm'> <img src='../image/11.gif' border=0 width="85" height="28"></a><br>
<a href='product4.htm'> <img src='../image/10.gif' border=0 width="90" height="28"></a><br>
</div>
<div id='KB2Parent' class='parent'><a href="product11.htm" onClick="expandIt('KB2'); return false">
<img src='../image/16.gif' border=0 width="90" height="32"></a><br>
</div>
<div id='KB3Parent' class='parent'><a href="product12.htm" onClick="expandIt('KB3'); return false">
<img src='../image/01.gif' border=0 width="90" height="64"></a></div>
</td>
</tr>
</table>
<div id='KB4Parent' class='parent'></div>
</td>
</tr>
<tr>
<td height="133"> </td>
</tr>
<tr>
<td height="118"> </td>
</tr>
</table>
<a href="#" onClick="expandIt('KB1'); return false"> </a></td>
<td width="656" height="556" align="center">
<table width="589" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" width="305" ><b><br>
</b></td>
<td width="284">
<div align="center"></div>
</td>
</tr>
<tr>
<td align="center" width="305"><img src="../photo/44.jpg" width="250" height="160" border="0"></td>
<td width="284" align="center"><img src="../photo/45.jpg" width="250" height="160" border="0"></td>
</tr>
<tr>
<td align="center" width="305" height="62">
<p class="f13tp" align="left"><br>
</p>
</td>
<td width="284" height="62">
<p class="f13tp"> </p>
</td>
</tr>
<tr>
<td width="305" align="center"><img src="../photo/47.jpg" width="250" height="160" border="0"></td>
<td width="284" align="center"><img src="../photo/46.jpg" width="250" height="160" border="0"></td>
</tr>
<tr>
<td width="305" align="center" class="f13tp">
<div align="left"></div>
</td>
<td width="284" class="f13tp"> </td>
</tr>
<tr>
<td width="305" align="center" class="f13tp"><img src="../photo/61.jpg" width="277" height="180"></td>
<td width="284">
<div align="center"><img src="../photo/62.jpg" width="277" height="180"></div>
</td>
</tr>
<tr>
<td width="305" align="center" class="f13tp">
<div align="left"></div>
</td>
<td width="284">
<p class="f13tp"> </p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body></html>

有一问题就是，它在改变窗口size的是时候，图片运动；在最大化的情形下，refresh ，图片不运动。为什么啊？
daoke 2001-10-05
  • 打赏
  • 举报
 回复
<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<a href="http://www.qq.com/opo/" target="_blank"><img src="opo.jpg" border="0"></a>
</div>

z-index:-1
改成正数最好大一点看看，如10
网页特效代码
网页特效代码，没事的时候学习看的，和大家分享一下，希望对大家有用
60个网页特效(js+flash)
在这个几盒内包括很多网页中常用的效果比如：顶部收缩广告效果、定时关闭的背投广告代码、JS图片卷帘门效果、随数字快速翻动幻灯代码等等，精心收藏的，分享出来，希望大家喜欢！
JavaScript+jQuery+项目实战系列视频教程
JavaScript jQuery 项目实战系列教程 能掌握JS和Jquery的基本技能，能完成基本的网页特效！
经典网页特效500例打包下载
经典网页特效500例！绝对500例！ 经不经典你说了算！ 一起一直自己用，现在贡献出来！ QQ式的导航 经典实用的触发型导航菜单 菜单变换与拖动 三级下拉菜单（通用版） 鼠标触及带边框菜单 HTML输出下拉内容 判断输入...
61个时尚网页特效
我今天整理了一下，平常常用的网页时尚特效，这个是61个网页特效有树形菜单，时间轴，照片墙....， 时间日期类 任意位置显示时钟 倒计时代码生成器很时尚 开发网站绝对用的上
其他

10,607

社区成员

29,048

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 其他
社区管理员
  • 其他
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章