12 2014 档案

使用JavaScript获取图片的真实尺寸大小
摘要：Webkit 内核的浏览器在加载完图片之后才能获取宽和高。所以，我建议使用onload时间来获取图片的宽和高1 var img = $("img")[0]; // Get my img elem2 var pic_real_width, pic_real_height;3 $("") // Make... 阅读全文
posted @ 2014-12-25 00:47 青苔1943 阅读(270) 评论(1) 推荐(0)
JS一趟循环消除一个数组里重复的元素
摘要：var arr=[1,2,3,3,4,4,5,5,6,1,9,3,25,4]; function deRepeat(){ var newArr=[]; var obj={}; var index=0; ... 阅读全文
posted @ 2014-12-23 14:35 青苔1943 阅读(323) 评论(0) 推荐(0)
解决float之后容器高度坍塌
摘要：在使用float属性的时候，我们经常会遇到这样的问题，当元素的设置了float，而父容器的高度就坍塌了，如下效果法国球星亨利宣布退役之后，国际足坛大腕们纷纷对他表示敬意，尤其是他以前效力的阿森纳队众球星都称赞他为“传奇人物。” 国际足联主席布拉特也发表推文说：“衷心祝福亨利。很遗憾看到一位世界冠军离... 阅读全文
posted @ 2014-12-23 10:42 青苔1943 阅读(428) 评论(3) 推荐(0)
闭包
摘要：当你看见function里面又嵌套着一个function,而内嵌的function又访问了外部的变量时，那就是闭包，如下代码：1 function foo(x){var tmp =3;function bar(y){2 alert(x + y +(++tmp));// will alert ... 阅读全文
posted @ 2014-12-22 17:17 青苔1943 阅读(235) 评论(0) 推荐(0)
修改input缺省的文字透明度及颜色
摘要：WebKit 与Blink 内核的浏览器(Safari, Google Chrome, Opera 15+) 使用伪元素:::-webkit-input-placeholder.Mozilla Firefox 4 to 18 使用伪类::-moz-placeholder.Mozilla Firefo... 阅读全文
posted @ 2014-12-22 00:43 青苔1943 阅读(920) 评论(0) 推荐(0)
超过容器的文字显示为省略号
摘要：当文字的长度超过容器的边框时，若想要显示多余的内容为省略号时，我们可以这么设置.truncate { width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}注意到white-space与ov... 阅读全文
posted @ 2014-12-21 15:59 青苔1943 阅读(173) 评论(0) 推荐(0)
使用CSS设置文字不可选
摘要：可以使用user-select属性实例：1 .noselect {2 -webkit-touch-callout: none;3 -webkit-user-select: none;4 -khtml-user-select: none;5 -moz-user-sele... 阅读全文
posted @ 2014-12-19 17:43 青苔1943 阅读(17251) 评论(0) 推荐(0)
使用JavaScript重定向网页
摘要：我们来看下下面两种方式：1 // 等同于HTTP重定向2 window.location.replace("http://baidu.com.com");3 4 // 等同于点击网页链接5 window.location.href = "http://baidu.com";window.locati... 阅读全文
posted @ 2014-12-19 00:39 青苔1943 阅读(341) 评论(0) 推荐(0)
什么时候该用!important?
摘要：在CSS裡面使用!important通常代表你這個人要麼懶惰，要麼自私或者是过于自信。首先让那些不知道的人看一下，!important是这么一回事：1 CSS2 p {3 color: red !important;}#thing {4 color: green;}5 HTML6 W... 阅读全文
posted @ 2014-12-18 16:41 青苔1943 阅读(2937) 评论(0) 推荐(0)
懒人的响应式排版
摘要：本文由本人翻译自:http://webdesign.tutsplus.com/tutorials/the-lazy-persons-guide-to-responsive-typography--cms-22822网站设计中争论最多的部门就是排版。在一个空白的页面放一个巨幅的标题会让你感觉自己像是一... 阅读全文
posted @ 2014-12-17 21:55 青苔1943 阅读(680) 评论(0) 推荐(0)
使用data attributes
摘要：本文由本人翻译自：https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributesHTML5是具有扩展性的设计，它初衷是数据应与特定的元素相关联，但不需要任何定义。data-* 属性允许我们在标准内于HTML元... 阅读全文
posted @ 2014-12-16 11:06 青苔1943 阅读(646) 评论(0) 推荐(1)
理解JavaScript:继承与原型链
摘要：本文翻译自https://wildlyinaccurate.com/understanding-javascript-inheritance-and-the-prototype-chainJavascript里的一切几乎都是对象，每一个对象都有一个链接到其他对象的内部属性，我们称之为prototyp... 阅读全文
posted @ 2014-12-15 13:11 青苔1943 阅读(290) 评论(3) 推荐(1)