主页移动背景代码
作者:sunny 来源:经典论坛 时间:2009-11-16 17:54:00
1、把这段拷到DW里,存成HTML文件。
<HTML>
<HEAD>
<TITLE>move background</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<script language="javaScript" type="text/javascript" src="movebg.js"></script>
<style type="text/css">
<!--
td { overflow: visible; clip:rect( ); font-family: "宋体"; font-size: 12px; color: #000000; text-decoration: none}
-->
</style>
</HEAD>
<BODY
bgColor=#F0F4F3 leftmargin="0" topmargin="0">
<DIV id=Lwegbild
style="CLIP: rect(0px 100px 100px 0px); HEIGHT: 300; LEFT: 92px; POSITION: absolute; TOP: 47px; WIDTH: 200; Z-INDEX: 74; visibility: visible" >
<table width="200" border="0" cellspacing="0" cellpadding="0" height="300">
<tr>
<td width="100" valign="top" align="left" height="100"> 11111111111111111</td>
<td width="100" height="100" align="left" valign="top"> 222222222222222222</td>
</tr>
<tr>
<td width="100" height="100" align="left" valign="top">33333333333333333</td>
<td width="100" height="100" valign="top" align="left">444444444444444444</td>
</tr>
<tr>
<td width="100" height="100" valign="top" align="left">55555555555555555</td>
<td width="100" height="100" valign="top" align="left">666666666666666666</td>
</tr>
</table>
</DIV>
<div id="Layer2" style="position:absolute; left:44px; top:46px; width:164px; height:274px; z-index:76">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" onMouseOver=YY_wf(0,0)>1</a> </td>
</tr>
<tr>
<td><a href="#" onMouseOver=YY_wf(1,0)>2</a> </td>
</tr>
<tr>
<td><a href="#" onMouseOver=YY_wf(0,1)>3</a> </td>
</tr>
<tr>
<td><a href="#" onMouseOver=YY_wf(1,1)>4</a> </td>
</tr>
<tr>
<td><a href="#" onMouseOver=YY_wf(0,2)>5</a> </td>
</tr>
<tr>
<td><a href="#" onMouseOver=YY_wf(1,2)>6</a> </td>
</tr>
</table>
</div>
</body>
</html>
1、把这段存成js文件,取名movebg.js,和上面的放在同一个文件夹。
// aspxhome.com
//
//weg1
function YY_wf (yy_x,yy_y){
yyLayerScroll('document.layers[\'Lwegbild\']','document.all[\'Lwegbild\']',1, yy_x*100, yy_y*100, 0, 0,1,1);
}
// Mover
// Mv ist fuer Soehne
var mv_end = 0;
var daLayer = 'Lperson';
var Mperson = 0;
var mv_step = 23;
var mr_step = 23;
var mv_to = 11;
var lage =-1;
function YY_mv(wohinx, isx, wohiny, isy){
if (document.layers||document.all){
if(!Mperson){}else{clearTimeout(Mperson)}
if(document.layers){
if(!isx)isx=document.layers[daLayer].top;
isx+=mv_step;
document.layers[daLayer].top = isx;
}
if(document.all) {
if(!isx)isx=document.all[daLayer].style.pixelTop;
isx+=mv_step;
document.all[daLayer].style.pixelTop = isx;
}
if(isx<wohinx){Mperson = setTimeout("YY_mv("+wohinx+","+isx+")", mv_to)}
}
}
function YY_mr(wohinx, isx, wohiny, isy){
if (document.layers||document.all){
if(!Mperson){}else{clearTimeout(Mperson)}
if(document.layers){
if(!isx)isx=document.layers[daLayer].top;
isx=isx-mr_step;
if(isx>=wohinx)document.layers[daLayer].top = isx;
}
if(document.all) {
if(!isx)isx=document.all[daLayer].style.pixelTop;
isx=isx-mr_step;
if(isx>=wohinx)document.all[daLayer].style.pixelTop = isx;
}
if(isx>=wohinx){
Mperson = setTimeout("YY_mr("+wohinx+","+isx+")", mv_to)
}
}
}
// navbar zurueck
var yyNavScrollBack=0;
function YY_c_r(nix, was){
if(was){yyNavScrollBack=was}else
if(!yyNavScrollBack){yyNavScrollBack=0}
status=yyNavScrollBack;
YY_c (0,yyNavScrollBack);
}
// CallScroller
function yyLayerScroll(targetNN, targetIE, delay, ex, ey, dx, dy, sx, sy, yyX, yyY) {
//status=(debug++) + ' ' + ex
if (document.layers) {
target = eval(targetNN);
var ct = target.clip.top;
var cb = target.clip.bottom;
var cl = target.clip.left;
var cr = target.clip.right;
yyY=Math.abs(Math.round((ct-ey)/sy));
dy=Math.round(-(ct-ey)/yyY);
yyX=Math.abs(Math.round((cl-ex)/sx));
dx=Math.round(-(cl-ex)/yyX);
if(yyX<1){dx=0}else{yyX--};
if(yyY<1){dy=0}else{yyY--};
var t = target.top;
target.clip.top = ct + (dy);
target.clip.bottom = cb + (dy);
target.top = t - (dy);
var l = target.left;
target.clip.left = cl + dx;
target.clip.right = cr + dx;
target.left = l - dx;
}else {
if (document.all) {
IEobjStr = targetIE.replace("['", ".");
target = eval(IEobjStr.replace("']", ""));
//yyIsScroll = -target.style.pixelTop+124;
if (target.style.clip) {
var clipv = target.style.clip.split("rect(")[1].split(")")[0].split("px");
var ct = Number(clipv[0]);
var cr = Number(clipv[1]);
var cb = Number(clipv[2]);
var cl = Number(clipv[3]);
var l = target.style.pixelLeft;
var t = target.style.pixelTop;
}
yyY=Math.abs(Math.round((ct-ey)/sy));
dy=Math.round(-(ct-ey)/yyY);
yyX=Math.abs(Math.round((cl-ex)/sx));
dx=Math.round(-(cl-ex)/yyX);
if(yyX<1)dx=0;
if(yyY<1)dy=0;
ncl = cl + dx;
nct = ct + dy;
ncr = cr + dx;
ncb = cb + dy;
target.style.pixelTop = t - dy;
target.style.pixelLeft = l - dx;
eval("target.style.clip = 'rect(' + nct + ' ' + ncr + ' ' + ncb + ' ' + ncl +')'");
yyY--;
yyX--;
}
}
clearTimeout(target.yyScroller);
if(yyY>0||yyX>0){
target.yyScroller = setTimeout("yyLayerScroll(\"" + targetNN + "\",\"" + targetIE + "\"," + delay + "," + ex+ "," + ey+ "," + dx+ "," + dy + "," +sx + "," + sy + "," + yyX + "," + yyY+ ")", delay);
}
else
{if(lage>-1){YY_Einrasten(lage);}}
}
3、js说明
function YY_wf (yy_x,yy_y){
yyLayerScroll('document.layers[\'Lwegbild\']','document.all[\'Lwegbild\']',1, yy_x*100, yy_y*100, 0, 0,1,1);
}
修改这段就可以达到你要的效果,Lwegbild是你要移动的层。
yy_x*100和yy_y*100分别是x、y轴的移动距离,当YY_wf(1,2)时,
就是向右移动1*100像素,想下移动2*100像素。最后的1,1分别是x、y轴的移动速度。那个0,0我忘了, :D :D :D自己试试,影响不大。