摘要: 前天做了个树形菜单,今天接着让它可拖动。补充一点:要禁止移动中选中文字,FF可以设置CSSxxxx{-moz-user-select:none;}其他的浏览器可以设置XXXX.onselectstart = function(){return false}一种实现原理就是点击没目标元素之后,创建一个占位元素(或者复制一份目标元素,即拷贝B),然后拖动目标元素(或者复制的来的新元素B);找到相应的位置之后,插入目标元素。清除占位元素或者B。比如有一个列表:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q 阅读全文
posted @ 2011-12-09 13:51 西山 阅读(763) 评论(0) 推荐(1) 编辑
摘要: web前端都知道,CSS的来源有三种一、user agent stylesheet用户代理的默认CSS(就是浏览器默认的CSS,http://www.cnblogs.com/xesam/archive/2011/12/01/2270553.html)二、author style sheets开发人员定义的CSS(前端开发人员写的external-style,embeded-style,inline-style)三、user style sheets用户自定义的CSS(用户自己写的)优先级由上至下依次增高user agent stylesheetuserdeclarations(normal)a 阅读全文
posted @ 2011-12-08 14:19 西山 阅读(9925) 评论(1) 推荐(4) 编辑
摘要: 废话不多说,下面分别检测各个浏览器下的e.pageXe.layerXe.offsetXe.clientXe.x属性;测试浏览器:FF9/Chrome15/opera11.52/safari5(win)/IE6/7/8/9测试代码:View Code <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head> < 阅读全文
posted @ 2011-12-08 11:53 西山 阅读(8119) 评论(3) 推荐(0) 编辑
摘要: 小提示:关于数组的concat和push方法。两者的区别主要有:concat是连接数组,不会修改原数组,返回值为连接后的数组,与push的重要区别是concat会展开数组的第一层子数组push是添加数组元素。就地修改原数组,返回值为添加的新项,push不会展开传入的数组。 var a = [1,2,3,4]; var b = [4,5,6,7]; var c = a.push(b); var d = a.concat(b); console.log('a',a); console.log('b',b); console.log('c',c); c 阅读全文
posted @ 2011-12-07 16:25 西山 阅读(2133) 评论(0) 推荐(0) 编辑
摘要: 说到树形菜单,貌似一般是用在一些管理系统里面的,我是还没有用到过,有些zTree之类的插件已经做得比较好了。我练习一下,以免不时之需。树形菜单不过就是把普通菜单重新排列一下,看起来像树形而已。上图京东的菜单,给他多几个嵌套,然后添加收缩伸展事件,差不多就行了。给个例子:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><he 阅读全文
posted @ 2011-12-07 12:55 西山 阅读(10931) 评论(0) 推荐(0) 编辑
摘要: 用过Prototype的人都知道,里面有个类叫做Template,用法示例如下: var str = '#{what} may have gone, but there is a time of #{how}'; var object = { what : 'Swallows', how : 'return' } var template_1 = new Template(str); var result = template_1.evaluate(object); console.log('result... 阅读全文
posted @ 2011-12-05 21:31 西山 阅读(1334) 评论(0) 推荐(0) 编辑
摘要: 按照W3C的说明,String对象的replace方法调用方式是stringObject.replace(regexp/substr,replacement)。这两个参数都是必须的,replace() 方法的参数 replacement 可以是函数而不是字符串。在这种情况下,每个匹配都调用该函数,它返回的字符串将作为替换文本使用。该函数的第一个参数是匹配模式的字符串。接下来的参数是与模式中的子表达式匹配的字符串,可以有 0 个或多个这样的参数。接下来的参数是一个整数,声明了匹配在 stringObject 中出现的位置。最后一个参数是 stringObject 本身。对于replacement 阅读全文
posted @ 2011-12-05 14:19 西山 阅读(3339) 评论(0) 推荐(0) 编辑
摘要: 这段时间学习下linux,觉得linux的多桌面不错,于是顺便用js实现一个,虽说不知道有什么用,就当玩玩。PS:颜色的设定没有考虑,桌面多了颜色就会出错。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head> <meta http-equiv="Content-Type" conte 阅读全文
posted @ 2011-12-04 01:02 西山 阅读(319) 评论(1) 推荐(0) 编辑
摘要: 幻灯片 阅读全文
posted @ 2011-12-02 21:03 西山 阅读(480) 评论(1) 推荐(0) 编辑
摘要: 有个网站总结了IE6/7/8/9,FF3.6.3,webkit(r7042),opera10.51的默认样式,熟悉一下可以让我们更好的明白一些书写CSS过程中的差异。网站地址:http://www.iecss.com/熟悉这些之后可以明白一、使用CSS reset的原因。二、*{margin:0;padding:0;}一刀切的做法为什么不提倡三、网上广泛流传的CSSreset为什么也有人不提倡从对比图可以看出,不部分标签其实是没有margin或者padding的。其中又有些标签一般是很少用到的,就算用到了,一般也会特殊定制。对于一般的应用,简单的css reset(按需)就可以了。比如:bod 阅读全文
posted @ 2011-12-01 14:35 西山 阅读(2626) 评论(3) 推荐(1) 编辑