2015年02月_natalie86

转载详解this

习惯了高级语言的你或许觉得JavaScript中的this跟Java这些面向对象语言相似，保存了实体属性的一些值。其实不然。将它视作幻影魔神比较恰当，手提一个装满未知符文的灵龛。以下内容我希望广大同行们能够了解。全是掏箱底的干货，其中大部分占用了我很多时间才掌握。全局this浏览器宿主的全局环境中，this指的是window对象。 type="text/java

2015-02-28 17:29:49 522

转载推荐大家使用的CSS书写规范、顺序

写了这么久的CSS，但大部分前端er都没有按照良好的CSS书写规范来写CSS代码，这样会影响代码的阅读体验，这里设计达人网总结一个CSS书写规范、CSS书写顺序供大家参考，这些是参考了国外一些文章以及我的个人经验总结出来，我想对写CSS的前端用户来说是值得学习的。　　CSS书写顺序　　1.位置属性(position, top, right, z-index, display, fl

2015-02-28 17:07:24 407

转载移动端前端笔记大全

1、关闭iOS键盘首字母自动大写IOS的机子，默认英文输入法状态下，首字母是自动大写的，有时候挺烦人的。我们写页面的时候有没有办法把这个自动大写关闭呢？autocapitalize的属性可以实现：在iOS中，默认情况下键盘是开启首字母大写的功能的，如果业务不想出现首字母大写，可以这样：input type="text" autocapit

2015-02-26 13:06:33 809

转载移动端伪类 :active 生效

移动端基本没有:active的概念，因为不像鼠标，会有经过状态，但是并不代表移动端的:active是没有的要CSS伪类 :active 生效，只需要给 document 绑定 touchstart 或 touchend 事件具体代码：style>a { color: #000;}a:active {

2015-02-26 12:52:44 1321

转载分享20个无版权的高清无码图库站

今天这组网站比较有特色，有专门分享美食图片的，有专门分享复古图片的，各领风骚，质量都是一顶一的棒。下面就是20个无版权的高清**图库站，记得收藏啊。CompfightCompfight 是一个图片搜索引擎，帮你快速找到心仪的免费图片。网站有演示按钮，单击即可看操作方法。Life Of PixLife of Pix 给你高分辨率的免费大图体验，

2015-02-09 13:20:14 106979

转载经典网页设计：使用颜色滤镜效果的20个网站

大的背景图像已经成为了今年网页设计的趋势。在图像排布文本和按钮并很好的搭配相当具有挑战性。因此，设计师使用创意的 Photoshop 滤镜和渐变来在图像上创建一个遮罩，并在其上放置其他的网页设计元素。这种新鲜的设计给网站带来独特的光泽。　　在此，我把在网页设计中应用创意的颜色滤镜的20个优秀网站例子集合在一起。我希望这些网站会给你灵感，帮助你创造类似的效果。向下滚动并享受！Newt

2015-02-09 13:16:20 511

转载 JQuery：各种操作表单元素方法小结

表单元素无处不在，已然成了Web应用不可或缺的一个部分。对表单最最最常见的操作就是获取表单元素的值或者更改表单元素的值。那在JQuery和JavaScript中怎么操作表单元素的值？JQuery操作表单总结：1、文本框、密码框、隐藏域、文本域（id换成对应的,value属性存在，才能利用attr(‘value’) 获取值，否则返回undefined）：1.1 获取—>$

2015-02-09 13:13:41 527

转载免费 PSD 下载： 20个精美的登录和注册表单

注册表单有许多不同的形状和尺寸，有的只是单个的输入框，有的则需要多个步骤。登录表单的设计将定义网站的性质，因此它应进行针对性的设计。下面的列表提供了20个醒目的登录和注册表单设计为您提供灵感。Rebound Newsletter – with PSD Login Form PSD Registration Form Dark Login Box

2015-02-09 13:09:39 772

转载学习JavaScript的必备读物

常常有人要我推荐学习 JS 的书籍或者在线教程。看起来每个人都有很好的理由在 JS 领域有所行动。如果你对让人兴奋的工作机会很感兴趣的又想要玩一玩有意思的东西，那么 JS 一定是个很棒的语言。隨著 JS 的流行度增加，相关的书籍、博客和教程也随之大量增多，但是我不可能所有的资源都了解过，但是我看到了一些很不错的东西也想在这里分享给你。　　书籍　　请注意，在这里我只会推荐我已

2015-02-09 13:04:25 492

转载炫酷实用的jQuery插件涵盖菜单、按钮、图片

新的一周开始了，今天我们要为大家分享一些全新的jQuery插件和HTML5/CSS3应用，这些jQuery插件不仅非常炫酷，而且还挺实用，这次的分享包含jQuery菜单、CSS3按钮已经多种图片特效，一起来看看吧。1、CSS3书本翻页动画书本翻页效果逼真今天我们要分享一款炫酷而且实用的CSS3动画效果，它是模拟书本翻页的动画特效。当鼠标滑过书本右上角时，书本即可向前翻一页

2015-02-09 12:59:25 693

翻译 javascript对象详述

译自：http://javascriptissexy.com/javascript-objects-in-detail/ 译者：生如夏花转载请注明转自natalie86博客第一次翻译老外的一篇长博文。不少地方还是不太确定怎么翻妥当，也许等以后更深入理解了就知道怎么翻了。但还是受益匪浅，博文写得很细，很好地帮助你理解一些较难理解的点。翻译不当地方，欢迎大家拍砖。 ja

2015-02-08 17:02:38 409

转载 jQuery插件之Cookie

一、jQuery.Cookie.js插件是一个轻量级的Cookie管理插件。　　特别提醒，今日发现一个特别的错误，google浏览器提示：has no method $.cookie。火狐浏览器提示:$.cookie is not a function;调试了半天，终于找到原因，如果同一个页面两次或者多次引入jQuery插件就会报此错误。　　使用方法：　　1、引入jQuer

2015-02-05 16:22:27 353

原创用jquery实现换肤的效果

看了《锋利的jquery》做了一个网页换肤的练习。效果如图：点选上面的色卡选项，下面相应的标签就会随之变色。 html的结构仍然是用ul和li包裹色卡

2015-02-05 15:16:25 6110 1

转载 .index()

描述: 从匹配的元素中搜索给定元素的索引值，从0开始计数。添加的版本: 1.4.index()这个方法不接受任何参数。添加的版本: 1.4.index( selector )selector类型: Selector一个选择器，代表一个jQuery对象，将会从这个对象中查找元素。添加的版本: 1.0.

2015-02-05 14:08:05 697

原创选项卡练习

之前做了《锋利的jquery》里的一个选项卡练习，现在来做一下回顾和总结。页面效果比较简单，要做的炫那是CSS的事，这里主要是学习用JQ实现选项卡的原理和思路。时事体育娱乐时事体育娱乐以上是html的结构，比较

2015-02-05 11:12:45 505

转载智图—源于QQ空间图片WebP化的思考

【序言】前段时间QQ空间的前端团队针对空间做了一番流量带宽优化，其中包括在空间装饰头图中应用WebP格式的图片。其实很早之前空间的相册就已经接入了WebP格式的图片，由于支持度还不是很高，所以其他产品线也一直没应用，这次实施也带动了其他产品的前端同学们重新对这一块领域进行优化。于是我们产生了制作一套完整的前端图片优化方案的想法，智图系统因此应运而生。先上两张图，对比一下WebP格式图片的压

2015-02-05 10:27:02 2012

转载关于less的css3前缀的写法

每天坚持做一件事（这事当然是有点难度和意义的事情，而不是睡觉。。。）还真不容易，有两天没有写前端笔记了。一方面是正职工作忙，另一面是感觉能输出的东西越来越少。那今天来分享的什么的，找来找去，觉得less的css3前缀的写法可以分享。因为最近也一直在准备用less写个css3动画库，简化css3动画的开发。 css3前缀比如我们要写一个animation的css3动画，

2015-02-05 10:09:17 10503

转载快速回弹滚动

我们先来看看回弹滚动在手机浏览器发展的历史： - 早期的时候，移动端的浏览器都不支持非body元素的滚动条，所以一般都借助 iScroll; - Android 3.0/iOS解决了非body元素的滚动问题，但滚动条不可见，同时iOS上只能通过2个手指进行滚动； - Android 4.0解决了滚动条不可见及增加了快速回弹滚动效果，不过随后这个特性又被移除

2015-02-05 10:02:48 704

转载 30款css3实现的鼠标经过图片显示描述特效

今天给大家分享30款css3实现的鼠标经过图片显示描述特效，鼠标经过这些图片的时候以非常炫的方式显示图片的描述。为保证最佳的效果，请在 IE10+、Chrome、Firefox 和 Safari 等现代浏览器中浏览。在线预览30款css3实现的鼠标经过图片显示描述特效.rar实现的代码。html代码：

2015-02-05 09:56:54 803

转载别不信！App三年内将被HTML5顶替彻底消失？

2007年W3C(万维网联盟)立项HTML5，直至2014年10月底，这个长达八年的规范终于正式封稿。过去这些年，HTML5颠覆了PC互联网的格局，优化了移动互联网的体验，接下来，HTML5将颠覆原生App世界。这听起来有点危言耸听，但若认真分析HTML5的发展史，你会发现，这个世界的发展趋势确实就是这样。HTML5对开发者

2015-02-05 09:50:13 459

转载发布两款JQ小插件（图片查看器 + 分类选择器）

图片查看器，github地址：https://github.com/VaJoy/imgViewer效果如下：这款当初大概写了2小时，有点匆忙地赶出来的，使用的接口很简单：$.bindViewer(".viewer-item");复制代码它的实现其实也没啥复杂的原理，唯一觉得可说的地方是图片展开的过程 —— 从小变大动态过

2015-02-05 09:45:38 888

转载 HTML/CSS一些需要注意的基础知识

border:0;边框存在但不现实并且占内存border:none;边框未渲染HTML的书写规范：1、标签换行。2、标签缩进。3、标签要关闭。4、标签名属性不能为空。5、首先要！doctype声明。6、编码格式为UTF-8。7、标签要半角英文小写。8、合理注释。9、

2015-02-05 09:35:17 338

转载翻译-你必须知道的28个HTML5特征、窍门和技术

一、新的Doctype//zxx:”doctype”中文意思指“文档类型”仍在使用麻烦的，不可能记得住的XHTML文档类型？<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2015-02-03 10:45:43 672

转载超级实用且不花哨的JS代码大全

事件源对象 event.srcElement.tagName event.srcElement.type捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode event.shiftKey event.altKey event.ctrlKe

2015-02-03 10:40:40 1134

转载前端周刊20150201期

【行业资讯】 1、撕起来了！工商总局与阿里巴巴阿里有了新的舆论麻烦。1月28日午间，人民网发表了一篇《工商总局白皮书要求阿里系高管守住底线克服傲慢情绪》的文章，直指阿里在内部管理、企业信誉方面存在众多问题。而就在昨天，淘宝网运营小二发出公开信“冒死”质疑国家工商总局近期公布的2014年下半年网络交易商品定向监测结果。 2

2015-02-03 09:49:18 467

转载提升移动设备响应式设计的8个建议

现在，对于任何种类的网站开发来说，响应式Web设计都不能再局限于纸上谈兵，其是开发阶段的一个关键步骤。作为设计师和开发人员，我们必须要了解有效响应式设计的重要性以及其在保证优秀终端用户体验方面的作用。随着web向着移动端逐步发展，现在响应能力对于网站来说已经必不可少。很多人没能在移动用户兴起时抓住时机进行顺应潮流，因此现在难以保证网站在移动设备上的体验流畅性。

2015-02-02 17:30:01 543

转载神奇的滚动动画，30个视差滚动网站设计

使用 HTML5 和 CSS3，我们能够在浏览器中创建更有趣和更吸引眼球的效果。其中，视差滚动（Parallax Scrolling）就是这样的效果之一。这种技术通过在网页向下滚动的时候，控制背景的移动速度比前景的移动速度慢来创建出令人惊叹的3D效果。　　第一个视差滚动效果的网站是由伊恩·科伊尔在2011年设计的（叫“Nike Better World”，现在已经改版了）。如今，视差滚

2015-02-02 16:24:18 414

转载经典网页设计：20个新鲜出炉的 HTML5 网站

经典网页设计系列精彩继续，今天这篇文章向大家展示20新鲜出炉的 HTML5 网站作品，让大家感受一下 HTML5 的魅力。HTML5 新增了许多重要的特性，像 video、audio 和 canvas 等等，这些特性使得能够很容易的网页中包含多媒体内容，而不需要任何的插件或者 API。而其它的新元素，例如 section、article、header 和 nav 等，则是用来丰富网页内容。

2015-02-01 21:19:08 869

natalie86的专栏