易截截图软件、单文件、免安装、纯绿色、仅160KB

javascript+div+css滚动菜单的实现.

效果图
代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scrollable</title>
<mce:script type="text/javascript"><!--
resizeCallback = function() {
var containerStyle = document.getElementById('scrollable_container').style;
var containerNewWidth = document.body.clientWidth - 32;
containerStyle.width = containerNewWidth + 'px';
document.getElementById('scrollable_content').style.left = '0px';
}
window.onresize = resizeCallback;
var scroll = false;
function scrollToRight(speed, ele) {
var container = ele.nextSibling;
var content = container.firstChild;
var containerLeft = container.offsetLeft - 16;
var contentLeft = content.offsetLeft;
var minus_result = containerLeft - contentLeft;
speed = minus_result > speed ? speed : (minus_result > 0 ? minus_result : 0);
if(scroll && minus_result > 0) {
content.style.left = contentLeft + speed;
setTimeout(function(){scrollToRight(speed, ele)}, 50);
}
}
function scrollToLeft(speed, ele) {
var container = ele.previousSibling;
var content = container.firstChild;
var containerRight = container.offsetWidth;
var contentRight = content.offsetLeft + content.offsetWidth;
var minus_result = contentRight - containerRight;
speed = minus_result > speed ? speed : (minus_result > 0 ? minus_result : 0);
if(scroll && minus_result > 0) {
content.style.left = content.offsetLeft - speed;
setTimeout(function(){scrollToLeft(speed, ele)}, 50);
}
}
var contentWidth = 0;

// --></mce:script>
<mce:style type="text/css"><!--
body{background: #778899;}

.author-information{background: #BBBBBB; width: 500px; height: 150px; text-align: left; padding: 0 5px; }
.author-information-lab


相关文档:

非常全面的实用JavaScript开发工具列表

在今天网络开发方面,JavaScript起了很关键的作用;像jQuery, MooTools, Prototype等等JavaScript框架以及其它JavaScript类库让我们的生活轻松了不少。但是随着Rich Internet Applications(RIA)的面世及迅速应用,书写更强大,更坚实可靠的JavaScript的需要日益迫切。(51CTO编辑:当前Web开发界普遍认为JavaScript将会成为 ......

学习JavaScript(一)

这几天在学JavaScript的基础知识,就把基础的知识整理一下。
 
1、JavaScript的四种基本的数据类型:数值(整数和实数)、字符串型(用“”或者‘’括起来的字符或者数值)、布尔型(true或false)、空值。
2、JavaScript的变量
声明变量:变量在脚本中第一次出现时候在声明中(var),变量的 ......

Javascript DOM 编程艺术

JS中数组的批量填充方式:
  1.在声明时同时进行填充
        var beatles = Array("John","Paul","George","Ringo");
  2.我们甚至用不着明确地表明我们是在创建数组.事实上,只需用一堆方括号括起来就足以创建我们想要的数组了: ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号