主页移动背景代码

作者: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自己试试,影响不大。

 

标签:移动,背景,JavaScript
0
投稿

猜你喜欢

  • 考虑SQL Server安全时所应注意的几个方面

    2009-01-04 13:57:00
  • asp 解析一个xml文件的公用函数集合

    2008-02-29 13:40:00
  • asp如何用FSO对象显示一个文本文件?

    2010-06-09 18:41:00
  • opera img onload重复执行

    2008-01-17 12:01:00
  • FrontPage XP设计教程4——Css样式表的应用

    2008-10-11 12:25:00
  • 安装MySQL5.0后出现1607异常的解决办法

    2009-02-26 15:52:00
  • 分享10个Js的小型库,效果真的很棒

    2009-08-27 15:38:00
  • 如何使用图片精灵优化你的网站

    2009-07-21 11:35:00
  • js游戏 俄罗斯方块 源代码

    2008-01-24 13:14:00
  • CSS灵活运行注释带来的益处

    2008-04-21 13:51:00
  • 双屏显示提升前端开发10%工作效率

    2009-03-16 18:22:00
  • oracle数据库添加或删除一列的sql语句

    2012-06-06 19:46:54
  • Oracle数据库处理多媒体信息

    2010-07-16 13:01:00
  • MySQL数据库只监听某个特定地址的方法

    2008-12-05 16:11:00
  • asp清理缓存的代码

    2011-03-09 11:16:00
  • W3C Group的JavaScript1.8新特性介绍

    2009-07-24 12:31:00
  • asp内置对象Application详解

    2007-09-19 12:08:00
  • 2003年至今网页尺寸增长3倍

    2008-04-29 19:27:00
  • Dreamweaver MX 2004新特点

    2008-02-03 11:35:00
  • 在ASP中使用SQL语句之10:视图

    2007-08-11 13:24:00
  • asp之家 网络编程 m.aspxhome.com