因火成烟-优快云博客

原创 style、currentStyle、getComputedStyle的应用

style,currentStyle,getComputedStyle #div1 { background-color: #f60; width: 400px; height: 200px; margin: 0 auto; } function css(obj, attr) { if (obj.currentStyle) {

2015-06-08 21:26:05 690

原创隐藏元素的3中方法

第一种： display属性，当属性值为none时，元素不会显示在页面上，元素原本占有的空间也会清除；当属性值为block时，元素设为块状元素，可以设置宽高，会显示在页面上，同样也会有空间；第二种:visiblity属性；当属性值为visible时，元素是可见的当属性值为hidden时，元素是隐藏起来不可见的，不同的是它仍然会占据空间；这一点和display:none，不同以上2

2015-05-08 20:50:06 693

原创 javaScript中对象的克隆

今天做了一道题，题目如下： var obj ={"key":"1", "value":2}; var newObj = obj; newObj.value += obj.key; alert(newObj.value); 问题是结果是alert的结果是多少；这个地方是对象的引用；2个对象会共用一个地址，对象名就是该对象的首地址，这个地方相当于数组；地址相同，改变o

2015-05-07 19:06:36 1174

原创倒计时setInterval()的使用

倒计时 body, div { margin: 0; padding: 0; } body { color: #fff; } #clock { width: 300px; margin: 10px auto; background: none repeat scroll 0 0 #1a1a1a; text-align

2015-05-06 09:10:33 805

原创网页时钟Data() 函数的使用

var oDate = new Date(); oDate.Month()+1，当前系统的月份，注意要+1，它默认是从0开始 oDate.getDate(),系统当前的日期中的日 oDate.getDay(),星期 oDate.getMonth(),月份 oDate.getHours(),小时 oDate.getMinutes(),分钟 oDate.getSecond(),秒数

2015-05-05 21:16:43 805

原创 js实现复选框/全选、全不选

1.点击全选，所有复选框选中 2，根据复选框复选个数更新全选框状态 3.根据全选框的状态，切换label，flag 4.反选上面是复选框的各种选项情况，实现逻辑一、.给全选框一个鼠标点击事件，把全选框的的状态给复选框在这里要加上2,3情况的解决二、反选选项，给反选一个鼠标点击事件，通过循环把复选框的状态进行切换在这里要加上2,3这2种情况；三、写一

2015-04-22 10:37:30 2202

原创 js判断页面加载是否完成

Document body { text-align: center; font: 700 30px/1.5 arial; } var oBody = document.body; var i = 0; document.onreadystatechange = subSomething; function subSomething() { if (do

2015-04-22 10:31:26 1108

原创条件表达式的嵌套

通过比较2个数的大小，我没有使用Math.max函数来实现，通过条件表达式同样可以 Document #outer { margin: 0 auto; width: 500px; } vs 最大的数是> ? var oInput = document.getElementsByTagName("input");

2015-04-21 21:31:21 1999

原创提示框效果

html5代码：提示框效果名车车标展示-鼠标移过显示车标 BMW宝马汽车 Alfa Romeo 阿尔法-罗米欧 Skoda 斯柯达

2015-04-20 21:50:06 852

原创 js实现修改文件（图片）路径

文件路径其实就是一个属性值；修改路径就是修改属性值而已；只不过这个属性值修改起来不只是简单地赋值来进行的修改的；那修改图片路径来举例，就是先找到需要修改的元素src属性值；把它用变量保存起来，这里是不修改源文件路径；把新的路径赋给保存源文件路径的变量；把这个新路径值传给需要修改的图片路径；上面说了思路，我用了2种方法来实现，这个实例是鼠标移过改变图片路径；第一种方法：

2015-04-20 21:07:33 6243

原创条件表达式

有时候会遇到这样的问题，鼠标在同一个元素上面移入移出，移入一个样式，移出一个样式；我经常是使用if,else,后来遇见了条件表达式这中高大上的东西,以前学C的时候用过；今天联系了播放列表的收缩，这里就需要对标题添加事件来控制收缩；so，问题来了，一个元素2种的样式；how to play？ js代码先贴上：var oH = document.getElementById("outer")

2015-04-20 20:55:01 959

原创 js实现年历

实现思路： 1.月份是放在li里面的，给月份的li添加onmouseover事件， 2.创建一个数组，在里面放每个月的节日；当月份li触发onmouseover事件时显示当前月的节日代码如下：var oLi = document.getElementsByTagName("li"); var oStr = document.getElementById("msg").getElements

2015-04-18 22:25:38 959

原创纯CSS写弹出层样式

弹出层的js比较好控制，给按钮添加点击事件，然后让弹出层显示，背景变暗并且不能点击；样式是纯css写的需要用到定位 position;使用position定位时需要注意定位是相对定位（reltive）还是绝对（abslute），绝对定位是继承他的父元素的。还有fixed;这个是让元素固定；不跟随滚动移动；当然，position的属性之后还有top。bottom和left.，right;

2015-04-18 21:17:46 9139

原创 js实现选项卡功能

标题是用无序列表，内容放在div里，内容div里面使用无序列表；实现逻辑： 1.通过dom操作找到标题里的li；需要给他添加onmouseover事件； 2.给触发了onmouseover事件的li设置效果 3.通过dom操作找到内容里的ul,当触发onmouseover 事件的时候给ul添加display属性；注意事项：需要使用this关键字，在添加onmouse事件时，需要给

2015-04-15 21:08:51 868

原创 js实现鼠标的移入移出控制图片的明暗显示

这是具体的样式，用的是无序列表。去除列表样式原有的样式；宽度；高度跟随内容变化（不设置；居中；黑色边框，内边距；设置内容与元素框的关系，使用overflow（规定如何处理不符合元素框的内容）在每个li里面放置img 设置li的高度与宽度；元素浮动；边框；外边距上10px，下10px 左右为0； img 设置向左浮动；透明度；滤镜再次设置（可以不用）;鼠标移入移出时的变化；给l

2015-04-07 19:43:57 3859

原创 js实现控制css样式

主要使用函数传值，改变div样式. 先找到js需要的元素，input，button，和下面需要改变的div的id; 新建一个函数，用来改变div的style；这里需要注意有个style数组，看代码就清楚；还使用了一个dom操作 oDiv.removeAttribute("style"); 这使得div移除现有样式，恢复原来的样式；完整js代码 var obtn = docum

2015-04-06 20:59:41 730

原创 js实现弹出层

通过点击一个button按钮，弹出一个对话框，实现背景变暗， 1.要有2个事件，第一个就是点击按钮，弹出对话框。第二个就是点击对话框的*号关闭对话框，回复原来样式，第二个在第一个之内，就是说先弹出对话框才有关闭对话框 2.效果事件就是使用display属性，block,显示div效果，none,隐藏div效果贴上js代码 var obtn = document.getElements

2015-04-03 21:59:41 882

原创 js求和

在input 中输入数字，输入方式以“,”分割，利用正则表达式找出来中的数字，利用split把找到的数字放到数组中，因为刚开始是String类型，在计算时需要转换类型，使用parsetInt转换为整型Int型。放上js代码 var oInput = document.getElementsByTagName("input")[0]; var oBtn = document.getElemen

2015-04-02 21:38:53 1018

TheFoma的专栏