js运动框架的共享侧边栏动画示例

本文介绍js运动框架的共享侧边栏动画的实现，供大家参考，具体实现方法如下：

复制代码代码如下所示：
* {

保证金：0px；

填料：0px；

}

# DIV1 {

宽度：319px；

身高：340px；

边境：1px solid # FFF；

位置：绝对；

上图：100px；

左：- 320px；

背景图片：URL（图片 1）；

后台重复：不重复；

}

# DIV1跨度{

宽度：30px；

身高：130px；

border: 1px solid蓝；

位置：绝对；

右：- 23px；

上图：95px；

背景：红色；

字体微软雅黑；

颜色：# ffffff；

文本对齐：中心；

行高：40px；

边界半径：0px 200px 200px 0px；

}
窗口。指针函数（）{

无功odiv = document.getelementbyid（联赛）；

VaR OSPAN = odiv.getelementsbytagname（'span）{ 0 }；

var时间=空；

var速度= 8；

（odiv。onmouseover =功能）{ / /这里整个div鼠标事件

ClearInterval（时间）；

时间= setInterval（）{（）函数（

如果（odiv。offsetleft > = 0）{ clearInterval（时间）；}

别的{

ODiv。风格。左= odiv offsetleft +速度+ 'px；

}

}，1）；

}

（odiv。onmouseout=功能）{ / /这里有鼠标事件的整个div

ClearInterval（时间）；

时间= setInterval（）{（）函数（

如果（odiv。offsetleft <= 320）{ clearInterval（时间）；}

别的{

ODiv。风格。左= odiv offsetleft速度+ 'px；

}

}，1）；

}

}

分享

优化的代码：

复制代码代码如下所示：
* {

保证金：0px；

填料：0px；

}

# DIV1 {

宽度：319px；

身高：340px；

边境：1px solid # FFF；

位置：绝对；

上图：100px；

左：- 320px；

背景图片：URL（图片 1）；

后台重复：不重复；

}

# DIV1跨度{

宽度：30px；

身高：130px；

border: 1px solid蓝；

位置：绝对；

右：- 23px；

上图：95px；

背景：红色；

字体微软雅黑；

颜色：# ffffff；

文本对齐：中心；

行高：40px；

边界半径：0px 200px 200px 0px；

}
窗口。指针函数（）{

无功odiv = document.getelementbyid（联赛）；

VaR OSPAN = odiv.getelementsbytagname（'span）{ 0 }；

var时间=空；

var＝8；

var速度= null；

功能移动（Bord）{

ClearInterval（时间）；

时间= setInterval（）{（）函数（

如果（odiv。offsetleft > Bord）{速度= -固相萃取；}

否则{速度= SPE；}

如果（odiv。offsetleft = = Bord）{ clearInterval（时间）；}

别的{

ODiv。风格。左= odiv offsetleft +速度+ 'px；

}

}，1）；

}

（odiv。onmouseover =功能）{ / /这里整个div鼠标事件

移动（0）；

}

（odiv。onmouseout=功能）{ / /这里有鼠标事件的整个div

移动（- 320）；

}

}

分享

希望本文能对大家的javaｓｃｒｉｐｔ程序设计有所帮助。