随笔分类 -  JavaScript

JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。
js自定义滚动条
摘要：<!DOCTYPE HTML><html><head><title>soul42</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312" ><STYLE type="text/css"> * { margin:0; padding:0;} body{width:100%;height:100%;} #list{width:500px;float:left;po 阅读全文
posted @ 2011-12-28 23:01 深蓝色梦想 阅读(320) 评论(0) 推荐(0) 编辑
事件（记录）
摘要：<!doctype html><html> <head> <style> .box{background:red;padding:5px 0;height:25px} #pop{height:100px;width:400px;background:orange} </style> </head> <body id="body"> <div id="box" class="box"> <a href="">目 阅读全文
posted @ 2011-12-27 13:49 深蓝色梦想 阅读(189) 评论(0) 推荐(0) 编辑
javaScript无限级菜单
摘要：<!doctype html><html> <head> <style type="text/css"> *{margin:0;padding:0;} ul{list-style:none;display:none} ul ul{list-style:none;position:absolute;left:100px;top:0;display:none} .menu{float:left;width:100px;margin-right:15px} li{widt... 阅读全文
posted @ 2011-12-27 13:46 深蓝色梦想 阅读(231) 评论(0) 推荐(0) 编辑
讲解JavaScript的事件委托技术.
摘要：讲解之前先来讲讲性能.如果一个整体页面里有大量的按钮.我们就要为每一个按钮绑定事件处理程序.这样就会影响性能了.首先每个函数都是对象,对象就会占用很多内存.内存中的对象越多,性能就越差.其次,dom访问次数增多,就会导致延迟加载页面.事实上,从如何来利用好事件处理程序,还是有很好的解决方案的.一、事件委托对事件处理程序过多的问题解决的方案就是事件委托技术.事件委托技术利用了事件冒泡.只需指定一个事件处理程序.我们可以为某个需要触发事件的父元素来绑定事件处理程序.HTML代码:<ul id="mylist"> <li id="li_1"& 阅读全文
posted @ 2011-12-10 00:20 深蓝色梦想 阅读(1786) 评论(6) 推荐(1) 编辑
由浅入深-javascript动画原理解析（一）
摘要：我很早写了一个javascript动画类，我觉得思路还不错，而且执行效率还不错，下面我将由浅入深的分享其实现。核心动画核心原理其实并不复杂，就这么几行代码：var fx = function (ontween, onend, duration) { var pos, runTime, startTime = + new Date, timer = setInterval(function () { runTime = + new Date - startTime; ... 阅读全文
posted @ 2011-11-28 16:37 深蓝色梦想 阅读(1287) 评论(0) 推荐(0) 编辑
键盘keyCode值参考表
摘要：把这些做个笔记.呵呵 阅读全文
posted @ 2011-11-27 17:25 深蓝色梦想 阅读(353) 评论(0) 推荐(0) 编辑
按下鼠标的几个修改键
摘要：function func(e){ var arr = new Array(); var e = e||window.event; if(e.ctrlKey){ arr.push("Ctrl"); } if(e.shiftKey){ arr.push("shift") } if(e.altKey){ arr.push("alt") ... 阅读全文
posted @ 2011-11-27 16:46 深蓝色梦想 阅读(270) 评论(0) 推荐(0) 编辑
前端推荐各大书籍[转载]
摘要：WEB前端研发工程师，在国内算是一个朝阳职业，这个领域没有学校的正规教育，大多数人都是靠自己自学成才。本文主要介绍自己从事web开发以来（从大二至今）看过的书籍和自己的成长过程，目的是给想了解JavaScript或者是刚接触JavaScript的朋友，介绍如何通过循序渐进的看书来学习javascript。一。 入门级 ：就是有一定的基础（比如最常见的HTML标签及其属性、事件、方法;最常见的CSS属性;基础的JavaScript编程能力），能够完成一些简单的WEB前端需求。推荐：《JavaScript dom 编程艺术》理由：此书绝对是入门的好书，本人也是在接触JS一段时间后才看的这本书。此书 阅读全文
posted @ 2011-11-27 11:11 深蓝色梦想 阅读(1993) 评论(8) 推荐(0) 编辑
事件属性relatedTarget,fromElement,toElement
摘要：obj:function(e){if(e.relatedTarget){ return event.relatedTarget;}else if(e.toElement){ return e.toElement; //ie}else if(e.fromElement){ return e.fromElement; //ie}else{ return null;}}IE下用event.fromElement,event.toElement来替代 relatedTarget 事件属性返回与事件的目标节点相关的节点。 对于 mouseover 事件来说，该属性是鼠标指针移到目标节点上... 阅读全文
posted @ 2011-11-27 01:01 深蓝色梦想 阅读(1160) 评论(0) 推荐(0) 编辑
无缝自动滚动
摘要：主要是最后一个要跟第一个一样就行了,<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/ 阅读全文
posted @ 2011-10-29 22:41 深蓝色梦想 阅读(244) 评论(0) 推荐(0) 编辑
一个select双击切换效果
摘要：无聊写了一个简单的select双击切换效果...让我把重点讲解下.changeSelect(true,this.id);changeSelect(false,this.id); //获取当前ID,true or false.if(opt.selected) //判断是否选中.elem.removeChild(opt); //删除当前select下的选中optionelem.nextSibling.nextSibling.appendChild(opt); //把当前select下的选中option追加到下一个select下elem.previousSibling.previousSibli.. 阅读全文
posted @ 2011-10-15 02:01 深蓝色梦想 阅读(1297) 评论(0) 推荐(0) 编辑
js图片轮播
摘要：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head> <title> New Document </title> <style type="text/css"> *{margin:0;padding:0;} ul{list-style:none outside none} .box{wid 阅读全文
posted @ 2011-08-08 11:28 深蓝色梦想 阅读(7063) 评论(0) 推荐(0) 编辑
JavaScript上下自动切换效果
摘要：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb23 阅读全文
posted @ 2011-06-28 02:25 深蓝色梦想 阅读(472) 评论(0) 推荐(0) 编辑
学习JavaScript的理由
摘要：导读：文章根据《Why a JavaScript hater thinks everyone needs to learn JavaScript in the next year》这篇文章翻译而来。译文由李松峰整理编译《学习JavaScript的理由》。内容如下：很长时间以来，JavaScript在我眼里都是编程语言中的二等公民。早先，它经常是很多安全问题的发源地，就像是胶水一样，它能把HTML应用与样式粘到一块，可没有人拿它来正正规规地编写程序；这样的情形太普遍了。而Java、Ruby、Python，这些才是真正能用来编写程序的语言。过去几年间，我对JavaScript的态度有了彻底的改变。 阅读全文
posted @ 2011-06-23 15:26 深蓝色梦想 阅读(428) 评论(3) 推荐(1) 编辑
一个javascript的左右滚动切换效果！
摘要：好久没写博客了，今天无聊做了个滚动的效果，再加了一个进度显示。document.getElementById("Progress").getElementsByTagName("li")[i].style.background = "orange";document.getElementById("Progress").getElementsByTagName("li")[i-1].style.background = "#fff";这个效果主要是对“前进”和“后退”进行判断 阅读全文
posted @ 2011-06-10 10:47 深蓝色梦想 阅读(2880) 评论(4) 推荐(0) 编辑
JavaScript实现IE6以下版本提示更新.
摘要：Navigator获取浏览器的名称var browser=navigator.appName获取浏览器的版本var b_version=navigator.appVersion 进行对IE5.5 and IE6.0判断if(b_version.indexOf("MSIE 6.0") != -1 || b_version.indexOf("MSIE 5.5") != -1){如果条件成立,则对其执行:document.getElementById("ie6").style.display = "block";否则al 阅读全文
posted @ 2011-04-10 17:26 深蓝色梦想 阅读(1876) 评论(0) 推荐(0) 编辑
JavaScript实现仿flash动感闪烁文字.
摘要：出处链接：http://www.5code.netvar arr = ["yellow","pink","green","orange","blue","#ccc","#ddd","black","#c00","#d122b2","#78336c","#0461a2","#d9764f","#1bae17"," 阅读全文
posted @ 2011-04-07 16:01 深蓝色梦想 阅读(471) 评论(0) 推荐(1) 编辑
JavaScript实现简单循环切换功能.
摘要：主要是定义一个"t"变量.然后在循环里赋予各不同的字符串值.还有就是用到setAttribute方法.当t=="tt"的时候把t=="mm",然后把ID为"blue"的div的ID="red". 整体代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 阅读全文
posted @ 2011-04-07 15:16 深蓝色梦想 阅读(561) 评论(0) 推荐(0) 编辑
JavaScript实现谷歌,百度切换搜索功能
摘要：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb23 阅读全文
posted @ 2011-03-31 17:16 深蓝色梦想 阅读(794) 评论(2) 推荐(1) 编辑

点击右上角即可分享
微信分享提示