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
相关文档：
ugmbbc发布于 2009-11-14 09:41:43| 7628 次阅读 字体：大 小 打印预览
var ReTitle = '回复:Google 排名中的 10 个最著名的 JavaScript 库';
感谢COMSHARP CMS的投递
新闻来源:tripwiremagazine.com
JavaScript 是 Web 开发与设计中不可或缺的东西，不管是一个简单的网页还是一个专业的站点，也不管你是高手还是菜鸟 ......
这几天在学JavaScript的基础知识，就把基础的知识整理一下。
1、JavaScript的四种基本的数据类型：数值（整数和实数）、字符串型（用“”或者‘’括起来的字符或者数值）、布尔型（true或false）、空值。
2、JavaScript的变量
声明变量：变量在脚本中第一次出现时候在声明中（var），变量的 ......
这个系列文章主要是讲述实现Javascript拖拽功能的基础知识，并将在最后给出一个完整的示例。适合对拖拽完全不懂的人阅读。
第一篇就先讲讲Javascript中的offsetParent属性吧。
支持的浏览器：Internet Explorer 4.0+，Mozilla 1.0+，Netscape 6.0+，Opera 7.0+，Safari ......
JavaScript允许创建和打开代表HTML文本, form对象和frame的窗口.
window对象是JavaScript客户层次结构的最顶层对象,
form元素和全部JavaScript代码都是存在于文档中,而文档被装载进窗口. 为了理解窗口怎样工作,你可以控制操作这些窗口.
打开和关闭窗口
当
用户启动(launch)Navigator时,将自动创建一个窗口.用户还可� ......
我们经常用js控制CSS样式，从而达到良好的用户界面和动态效果。我们经常使用的两种方式：
方法1：
var element= document.getElementById(”id”);
element.style.width=”200px”;
element.style.height=”200p ......
