日常 bug & 小技巧(持续更新)

1. 在火狐浏览器上,图片会莫名多出 .5 px

图片.png

图片.png

图片.png
  • 原因是 img 标签的问题:

    • img是替换内联元素 replaced inline element,属于inline element类目。

    • 和其它的内联元素有什么不同呢?它在计算height/margin/width等值或在绝对定位的时候,有一些额外的规则。(CSS2.1 第10章)比如设定了width但未设置height, img的height会根据比列缩放。
      img是替换内联元素 replaced inline element,属于inline element类目。

    • 和其它的内联元素有什么不同呢?它在计算height/margin/width等值或在绝对定位的时候,有一些额外的规则。(CSS2.1 第10章)比如设定了width但未设置height, img的height会根据比列缩放。

    • 类似于 inline-block,行内块元素,行内替换元素

  • 解决方法:给 img 标签添加 display:block;

2. 在 iOS 端页面中做弹窗,当弹窗弹出时会出现一个:上下滑动时影响到弹窗下面的内容也就是 container 内容的滚动条

  • 具体解决方案:

    • 在 layout css 全局中新增一个类名样式
      /* 弹窗专用 禁止滚轮 滚动*/
      .scrollnone{width:100%;height:100%;overflow:hidden;position:fixed;max-width:640px;min-width:320px;left:0;right:0;margin:auto;}
    
    • 使用方法参照下面的代码片段:
        //公用的手机端处理 iOS 弹窗 bug
    this.ioslayopenpopup = function () {
        var _me = this;
        $("body,html").addClass("scrollnone");
        return _me;
    };
    //公用的手机端处理 iOS 弹窗 bug
    this.ioslayclosepopup = function () {
        var _me = this;
        $("body,html").removeClass("scrollnone");
        return _me;
    };
    
            //公用的关闭弹窗
    this.closelaypopup = function () {
        var _me = this;
        $('#lay-popup-bg,.lay-popup').hide();
        _me.ioslayclosepopup();
        return _me;
    };
    //打开报名弹窗
    this.openlaypopup0 = function () {
        var _me = this;
        _me.closelaypopup();
        $('#lay-popup-bg,.lay-popup0').show();
        _me.ioslayopenpopup();
        return _me;
    };
    

3. 在手机端使用的一些全局的样式代码片段

/*文本单行溢出隐藏*/
.txtoneline{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
/*文本多行溢出隐藏  -webkit-line-clamp: 2; 溢出行数*/
.txtmorline{display: -webkit-box; -webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}

/* 公用限制最大最小宽,且居中显示类名 */
.limitcen{max-width:640px;min-width:320px;margin:0 auto;width:100%;}
/* 公用完美居中样式 */
.perfectcen{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;}

html{font-size:calc(100vw / 3.75);}/* 对浏览器兼容性要求较高 CSS3 属性 */
html,body{ font-size:14px; font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;background:#f3f3f3; color:#333; -webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; text-size-adjust:none;padding:0;margin:0 auto;max-width:640px;min-width:320px;-webkit-tap-highlight-color:rgba(0,0,0,0);/* 取消链接高亮 */}

/*清除浮动*/
.clearfix:after{content: " ";display:block;height:0;clear:both;}
.clearfix{*zoom:1;}/*IE6/7*/

/*表单元素统一初始化样式*/
input,select,button{ vertical-align:middle; margin:0; font-family:microsoft yahei;-webkit-appearance: none;/*去除阴影*/border:0;outline:0;background-color:transparent;}
.checkbox{-webkit-appearance: checkbox;}
input[type="checkbox"]{-webkit-appearance: checkbox;}
select{background: url("/Images/share/icon-select-arrow.png") no-repeat scroll right center transparent;background-size:.14rem .08rem;}

/*input palceholder 样式自定义*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #999;
}
/* 使用webkit内核的浏览器 */
input:-moz-placeholder, textarea::-webkit-input-placeholder {
    color: #999;
}
/* Firefox版本4-18 */
input::-moz-placeholder, textarea::-webkit-input-placeholder {
    color: #999;
}
/* Firefox版本19+ */
input:-ms-input-placeholder, textarea::-webkit-input-placeholder {
    color: #999;
}

4. PC 端滚动条样式自定义代码片段

/*自定义滚动条样式*/
.common-scrollbar::-webkit-scrollbar {
    width: 5px;
}
.common-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.2);
    border-radius: 10px;
}
  • 效果图
GIF2.gif

5. HTML5中的data-*属性和jQuery中的.data()方法使用

参考文章链接:http://blog.csdn.net/fly_zxy/article/details/50687691
参考 demo 链接:https://codepen.io/voronianski/pen/aicwk?q=Typewriter&limit=all&type=type-pens

  1. HTML5中的data-*属性

我们往往会根据需要在HTML标记上添加自定义的属性来存储和操作数据,我们自定义的属性名字也千奇百怪,五花八门。我们可以通过原生的getAttribute()或jQuery中的.attr()来获取我们自定义的属性。但是前端技术在向着规范化前进。HTML5标准规定,自定义的属性都已data—*开头,这样就区分开了固有属性和自定义属性。HTML5代码示例如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>data-* 在 HTML5 和 jQ 中的用法</title>
</head>
<body>
    <div id="container" data-name="小川" data-english-name="xiaochuan" data-Age="22"></div>
    <script>
        // JS5 的写法
        var element = document.getElementById('container');
        var dataObject = element.dataset;//获取到的是一个键值对的对象
        console.log(dataObject);//DOMStringMap {name: "小川", englishName: "xiaochuan", age: "22"}
        for(var key in dataObject){//遍历对象的键与值
            console.log(key);//name     englishName     age
            console.log(dataObject[key]);//小川       xiaochuan       22
        }
    </script>
</body>
</html>
  • 上面示例代码总结:

在获取自定义属性的值时,使用dataset属性,然后通过自定义属性data-name的名称去掉data如:dataObject[name]去获取值。dataset是JS5规范中新增加的属性,用于和data-*配合使用。

  • 需要注意的是:
    • 如果data-后面包含了“-”,例如 english-name,"-"会被去掉,自动的转换成为骆驼峰式的命名 englishName。这是因为JSON Object 的key不能包含”-“。
    • 如果data-后面的单词有大写,例如 Age,将会转存成小写 age。
    • 如果你想删除一个data-*属性,请使用 delete dataset.name或者dataset.name=null;
    • data-*属性看起来很好,但是不幸的是只有在Chrome 8+ Firefox(Gecko) 6.0+ Internet Explorer 11+ Opera 11.10+ Safari 6+的浏览器中实现了此标准。如果你需要兼容各主流浏览器的不同版本建议还是使用原生的getAttribute()或jQuery中的.attr()。
  1. jQuery中的.data()

jQuery中的.data()方法作用:在jQuery对象对应的DOM元素上获取或存放key-value对。我们可以通过html5的data-属性在元素上存取数据,在jQuery也可以通过data()来实现。data()方法有多个重载,传递一个参数是获取value值,传递两个参数是存储或覆盖已存在的值,传递一个JSON Object是在元素上存储或覆盖已存在的多个key-value对。如果通过data() 在元素上存储key-value,value可以是一个对象,而不是像data-只能存储一个字符串的value。下面给出一个综合示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>data-* 在 HTML5 和 jQ 中的用法</title>
</head>
<body>
    <div id="container" data-name="小川" data-english-name="xiaochuan" data-Age="22"></div>
    <script>
        //jQ 写法
        var element = $('#container');
        var dataObject = element.data();//获取到的是一个键值对的对象
        console.log(dataObject);//{age: 22, englishName: "xiaochuan", name: "小川"}  这个输出的整个的结构和上面的是一样的  但是顺序是相反的 从后往前
        $.each(dataObject,function(key,value) {//遍历对象的键与值
            console.log(key);//age      englishName     name
            console.log(value);//22     xiaochuan       小川
            console.log($(this));//r.fn.init [Number]       r.fn.init(9) ["x", "i", "a", "o", "c", "h", "u", "a", "n"]      r.fn.init(2) ["小", "川"]
            element.data(key,value+'1');//修改 value
            // element.removeData(key);//删除属性的方法
        });
        console.log(dataObject);//{age: "221", englishName: "xiaochuan1", name: "小川1"}  修改后的对象  但是这个修改并不会影响页面中的属性的值  只是在 jq 中可以调用
    </script>
</body>
</html>
  • 上面示例代码总结:

.data()可以获取通过data-属性存储的值。
通过.data()修改data-
属性的值不会显示在HTML标记中,我们只是通过.data()在元素存储了一个新值。
.removeData()也不能删除通过data-*存储的真正的页面上的数据。由于jQuery是一个通用的JS框架,对浏览器兼容性做的非常好,大多数情况,我们应该通过.data()在元素上存取数据(有一个好处是可以存储一个对象)。

image.png

demo github:https://github.com/sunxiaochuan/simple-demo/tree/master/data_H5_jQ-Demo

6. css 实现简单的关闭按钮

/*css 实现关闭叉号*/
.css-close-btn(@width: 30px,@height: 30px,@bgcolor: @colorwhite,@linewidth: 30px,@lineheight: 30px,@linebgcolor: @colorwhite) {
    background-color: @bgcolor;
    width: @width;
    height: @height;

    &:before {
        content: "";
        display: block;
        position: absolute;
        width: @linewidth;
        height: @lineheight;
        background-color: @linebgcolor;
        top: 50%;
        left: 50%;
        -moz-transform: translate(-50%,-50%) rotate(45deg);
        -ms-transform: translate(-50%,-50%) rotate(45deg);
        -o-transform: translate(-50%,-50%) rotate(45deg);
        -webkit-transform: translate(-50%,-50%) rotate(45deg);
        transform: translate(-50%,-50%) rotate(45deg);
    }

    &:after {
        content: "";
        display: block;
        position: absolute;
        width: @linewidth;
        height: @lineheight;
        background-color: @linebgcolor;
        top: 50%;
        left: 50%;
        -moz-transform: translate(-50%,-50%) rotate(-45deg);
        -ms-transform: translate(-50%,-50%) rotate(-45deg);
        -o-transform: translate(-50%,-50%) rotate(-45deg);
        -webkit-transform: translate(-50%,-50%) rotate(-45deg);
        transform: translate(-50%,-50%) rotate(-45deg);
    }
}

/*具体的引用实现*/
.rule__close-btn {
                .css-close-btn(42 / @layremvalue,42 / @layremvalue,#ddd,18 / @layremvalue,2 / @layremvalue,@colorwhite);
                position: absolute;
                border-radius: 50%;
                right: 30 / @layremvalue;
                top: 26 / @layremvalue;
            }
  • 效果图

image.png

公司活动页面手机端 => 规则弹窗

7. 在手机端上自定义的一些可公用的 less 变量

/*配合 js 计算的 rem 使用具体换算设计稿的 20px = 20 / @layremvalue*/
@layremvalue: 100rem;

/*flex 垂直居中布局*/
.flex(@align: center) {
    display: -webkit-flex;
    display: flex;
    /*y轴对齐方式 可传参*/
    align-items: @align;
    /*x轴对齐方式*/
    /*justify-content:center;*/
}
/*换行,第一行在上方*/
.flex_wrap {
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

/*transform: translateZ(0); 开启动画硬件加速*/
.openanimatequick {
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    /*修复卡顿*/
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/*背景渐变 线性渐变  由下到上 可传色值参数*/
.bggradient-bot-top(@colorstart,@colorend) {
    background-image: -ms-linear-gradient(bottom, @colorstart,@colorend);
    background-image: -moz-linear-gradient(bottom, @colorstart,@colorend);
    background-image: -webkit-gradient(linear, bottom, top, from(@colorstart), to(#872ccf));
    background-image: -webkit-linear-gradient(bottom, @colorstart,@colorend);
    background-image: -o-linear-gradient(bottom, @colorstart,@colorend);
    background-image: linear-gradient(0, @colorstart,@colorend);
}

/*内边框 用阴影实现*/
.shadow-inset(@width: 1px,@color: @coloryellow1,@style: inset) {
    box-shadow: 0 0 0 @width @color @style;
}

8. 手机端的 rem 具体实现方法:将下面的 js 片段放置于 <head></head> 标签内部,确保页面加载时优先计算这部分的 js 否则会出现闪屏的 bug

<script>
        //初始化 html fontSize 值
        //设计稿 720
        //除以7.2 这里是以iphone6 的宽度375px为标准,为了保证html的字体大小为100px。这样我们在换算的时候,1px 就是0.01rem,就很容易计算。(设计稿是 750 w,实际是 720 所以 除以7.2)
        function calcHtmlFontSize() {
            var htmlEle = document.documentElement;
            var htmlWidth = document.documentElement.clientWidth || document.body.clientWidth || window.innerWidth || window.screen.width;
            //console.log(htmlWidth);
            //强制改变可视区域的宽度 页面最宽为 640 最窄为320
            if (htmlWidth > 640) {
                htmlWidth = 640;
            } else if (htmlWidth < 320) {
                htmlWidth = 320;
            }
            //console.log(htmlWidth);
            htmlEle.style.fontSize = htmlWidth / 7.2 + 'px';
        }
        calcHtmlFontSize();
        window.onresize = function () {
            calcHtmlFontSize();
        }
    </script>

9. PC 端常用的右侧固定定位的导航条 css 和 js 配合实现,这个东西是参照的偶尔看到的一个淘宝活动页的效果写的

  • less
/*活动页面专用右侧固定定位导航  参数的数值可以在引用时随意的修改*/
.activity-fixed__nav(@width: @px120,@height: @px400,@backgroundColor: @coloryellow4,@marginRight: -(600 + @width)) {
    .openanimatequick;
    .box-style;
    position: fixed;
    width: @width;
    height: @height;
    right: 50%;
    top: 0;
    bottom: 0;
    margin: auto @marginRight auto auto;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    -webkit-transition: all .5s;
    transition: all .5s;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    background-color: @backgroundColor;
    z-index: 99;
}

/*具体的引用实现*/
.fixed__nav{
  .activity-fixed__nav;
}
  • js
//滚轮滚动事件
    $(window).scroll(function () {
        var _this = $(this);
        var targetTop = _this.scrollTop();
        //活动页面专用右侧固定定位导航 动画
        if (targetTop > $(window).height() - 600) {
            $("#fixed__nav").css({ 'transform': 'scale(1)', '-ms-transform': 'scale(1)', '-moz-transform': 'scale(1)', '-webkit-transform': 'scale(1)', '-o-transform': 'scale(1)' });
        } else {
            $("#fixed__nav").css({ 'transform': 'scale(0)', '-ms-transform': 'scale(0)', '-moz-transform': 'scale(0)', '-webkit-transform': 'scale(0)', '-o-transform': 'scale(0)' });
        }
    });
  • 效果图

公司活动页面 => 滚动时右侧导航条

21.gif

10. 向上的三角形 less

/*向上三角形可传参数*/
.triangle-top(@size: @px5,@color: @colorwhite) {
    width: 0;
    height: 0;
    border: solid @size;
    border-color: transparent transparent @color transparent;
}

/*具体的引用实现*/
&:before {
                    content: "";
                    position: absolute;
                    .triangle-top;
                    top: @px7;
                    right: @px13;
                }
  • 效果图
image.png

11. 全屏 canvas 不能被选中

/*全屏 canvas 不能被选中*/
.full-canvas {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
    pointer-events: none;
}
  • 效果图

公司实现页面 => canvas 烟花效果

image.png

12. 上面的页面实现的烟花效果的源码

烟花效果2 出处:copy 京东一活动源码

13. html 页面写 IE hack

详细说明资料的请参看网址:关于IE的一些hack - !win ! - 博客园 我这边是直接上代码的哟~

  • 先来段文字说明

ie的条件语句常用的有几下几种(所有条件注释语句在非IE浏览器下都是普通的注释,不要用非ie去给非IE的浏览执行操作):
lt :就是Less than的简写,也就是小于的意思。
lte :就是Less than or equal to的简写,也就是小于或等于的意思。
gt :就是Greater than的简写,也就是大于的意思。
gte:就是Greater than or equal to的简写,也就是大于或等于的意思。
!:就是不等于的意思,跟javascript里的不等于判断符相同。

  • 上代码
<!--[if IE]>
    只有IE才支持
<![endif]-->

<!--[if !IE 7]>
    IE7不支持
<![endif]-->

<!--[if lt IE 8]>
    IE8以下浏览器才支持
<![endif]-->

<!--[if lte IE 8]>
    IE8及以下浏览器才支持
<![endif]-->

<!--[if gt IE 8]>
    IE8以上浏览器才支持
<![endif]-->

<!--[if gte IE 8]>
    IE8及以上浏览器才支持
<![endif]-->
  • 上面的代码只是摘自人家的示例,具体设置还得看业务需求 我们用的是 IE9 以下
<!--[if lt IE 9]>
<![endif]-->

14. 早期工作时总结的 .txt 合集

  • get小知识
1、新版京东首页采用了新的加载方式,对页面进行了拆分。用户访问到每个楼层时采取异步加载当前楼层数据的方式,简单来讲就是只加载你所看到的内容,看不到的内容并不进行加载,同时利用Local Storage把数存储到浏览器本地当用户回访时,优先从本地读取数据,有更新时再请求后台结构,这样的做法能够将页面加载时间缩短60%

2、http://web.jobbole.com/83507/ 京东首页前端技术剖析与对比
3、http://www.android100.org/html/201405/23/13070.html       js中offsetLeft,offsetTop,offsetParent详解

4、http://www.jb51.net/article/55787.htm     js获取元素相对窗口位置的实现代码----------
--- getBoundingClientRect()    好用的 -------------------------------
http://www.knowsky.com/607772.html      getBoundingClientRect()兼容性处理

5、http://web.jobbole.com/84285/#comment-96603       (移动端)使用Flexible实现手淘H5页面的终端适配-------------
https://github.com/amfe/lib-flexible    Flexible教程---------------
http://www.w3cplus.com/css/viewports.html   viewports(视口)剖析---------------
http://www.w3cplus.com/css/towards-retina-web.html      走向视网膜(Retina)的Web时代--------
http://ww2.sinaimg.cn/large/0064cTs2jw1ey8ou31mjgj31191v04dc.jpg      移动端处理图片的方法缩略图-------
http://www.xiconeditor.com/     favicon.ico 文件在线制作(好用但是不会操作)--------
https://imageoptim.com/mac      在线图片压缩 (mac)

6、http://jingyan.baidu.com/article/6181c3e0678e1a152ff15372.html    Html网页返回顶部功能的几种实现方法

7、http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201511112772.html       JavaScript的内置对象navigator对象(与浏览器相关,主要判断浏览器)

8、http://www.jb51.net/article/14397.htm     js刷新页面方法大全

9、https://www.douban.com/note/296018037/        <marquee>标签 HTML跑马灯

10、https://segmentfault.com/a/1190000000481884      console 详述

11、http://blog.csdn.net/xiaoyousifang/article/details/5659667       分页技术原理与实现(一)——为什么要进行分页及怎么分页         
http://www.zhihu.com/question/21280526      网页中分页原理是什么?

12、https://www.zhihu.com/question/20251786  搜索引擎(福利)
http://www.open-open.com/doc/       OPEN开源文档,技术文档分享平台

13、http://www.jiathis.com/      网站做分享功能时  可以调用上面303092

14、http://www.open-open.com/code/view/1446774303092     程序员都会的 35 个 jQuery 小技巧

15、http://www.open-open.com/doc/view/3d52b714e1504050a1ba0467f48c4bc6       jQuery性能优化的38个建议.doc

16、http://www.open-open.com/doc/view/407f380c89914c35a402ee583d30ab74       50个高级jquery代码开发技巧.pdf

17、http://www.jb51.net/html5/171764.html            HTML5 input placeholder 颜色修改示例
  • git命令行
git config --global user.name "xiaochuan"  配置一个用户名
     配置    全局配置
git config --global user.email "1264086566@qq.com"  配置一个邮箱

git init   (master 主分支)  初始化

git status  查看状态  判断工作区内是否有添加、删除、更改文件

git add readme.txt   添加文件到暂存区

    日志
git commit -m "create readme.txt"   提交到分支(要先添加到暂存区)  日志  日志内容
git commit -m "modify readme"   修改后的提交方法

git diff readme.txt  查看当前文件内容和之前创建版本时内容的区别

将更改后的文件添加到分支
git add readme.txt
git commit -m "modify readme"

git reset --hard HEAD 回退到上一个版本(一般不用)
git log --pretty=oneline  显示日志 最好 在一行
git reset --hard 123456  回滚到某一个位置 1-6指的是显示的日志的位置

git checkout   未放入暂s存区的恢复成版本库;放入暂存区的恢复成暂存区
    分支
git branch  查看所有的分支
git branch 分支名   创建分支
git branch dev 查看分支dev
git checkout dev  切换分支
git merge dev  整合(合并)分支
git branch -D dev 强制删除分支  大D代表强制删除  小d表示分支提交后才能删除
    远程版本库
ssh-keygen -t rsa -C "1264086566@qq.com"  在本地创建一个秘钥(原因:多个计算机共享要加密)
寻找秘钥:C:\用户\Administrator\.ssh\id_rsa.pub  用记事本打开

粘贴 ctrl+shift+ins  
  • js 用/语法
http://www.w3school.com.cn/jsref/jsref_indexOf.asp  JavaScript indexOf() 方法
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=403067212&idx=1&sn=465646b311873e5625dbba5f8fc72e6d&scene=4#wechat_redirect    jQuery.each()的5个案例
http://zhidao.baidu.com/link?url=GxxDQyuDQw9bON-o7CyElJbdwocQ3VONLtHIEmJKudw38Z5CuBcbvt8mHKXGKMXQExQ0j8VUCFIKwl4FmpfG4_ 怎么让jquery事件执行一次呢
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=404067096&idx=1&sn=7c6f5546a3c221dc3737856c64fb20bb&scene=4#wechat_redirect    怎么消除 JS 中的代码坏味道
在js中只要遇到[]就是中括号
遇到[]就是创建数组
遇到{}就是创建对象
这是利用数组将x和y的值进行了互换   y = [x,x=y][0];

http://blog.csdn.net/pvfhv/article/details/5467626  关于http://www.google-analytics.com/ga.js 网站访问分析
            jq方法
http://zhidao.baidu.com/link?url=azaviYOa9MrQTLLDVISHnByzv__rJ86n59A6SjmG3Ple2xV9FPbhZn3Q1kKjRIKsmZwrQ2kYSnTLrhEG1SfOJK         获取input text框中所输入文字的改变事件     
http://www.w3school.com.cn/jquery/event_focus.asp   input  focus() 方法

http://www.oschina.net/question/998019_2147685?fromerr=xkKdikD4 php中文手册
http://www.php100.com/html/shipinjiaocheng/     PHP100.com

http://www.cnblogs.com/sususu/archive/2012/07/04/2575816.html       js 接口练习

http://tanning555.blog.163.com/blog/static/5297517120138184650359/      JQ checkBox全选,反选,取消
  • 功能/特效网站
http://manos.malihu.gr/jquery-custom-content-scroller/      jQuery 滚动插件
http://www.haorooms.com/post/ios_fixed_input        iOS下的 Fixed + Input 调用键盘的时候fixed无效问题解决方案
2015年5月29日 15806次浏览
http://www.tuicool.com/articles/aEB3MbR     http://blog.csdn.net/XIAOZHUXMEN/article/details/50886299       CSS3 修改和去除移动端点击事件出现的背景框 (tap-highlight-color)
http://web.jobbole.com/87481/           移动端样式小技巧
http://www.codeceo.com/article/22-array-methods-of-javascript.html      JavaScript数组中的22个常用方法
http://www.jb51.net/article/56465.htm       利用jquery操作Radio方法小结
http://www.jb51.net/article/87374.htm       JQuery控制图片由中心点逐渐放大效果
https://segmentfault.com/q/1010000000521764 怎么修改单选框radio默认样式
http://www.divcss5.com/jiqiao/j510.shtml        title换行方法 如a链接标签内title属性鼠标悬停提示内容换行
http://blog.csdn.net/dannywj1371/article/details/8127778     CSS控制文字只显示一行,超出部分显示省略号
<table cellpadding="0" cellspacing="0"></table>     table tr 空白间隔去除方法
filter:alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity: 0.5;opacity: 0.5; css 背景透明
http://www.daimajiayuan.com/sitejs-18604-1.html     JS手机号码验证
http://www.moton.com.cn/article/index/id/9.html     解决IE8及以下版本不支持CSS3的nth-child()的写法
overflow-y: auto;max-height:400px;  div>dl>dt       div标签实现右侧实现滚动条
display:inline-block;下面的间隙解决方法          父级 font-size:0
http://www.dreamdu.com/javascript/Math.floor/       JavaScript Math.floor() 函数
http://www.cnblogs.com/htwdz-qhm/p/3967974.html     深度理解Jquery 中 offset()   offset().top 方法
http://jingyan.baidu.com/album/ce09321b55c7662bff858fa0.html?picindex=1     HTML 列表中的dl,dt,dd,ul,li,ol区别及应用
http://zhidao.baidu.com/link?url=ce1ePE2ya1MIMceVw0GdJOCI3Yiaw2eU_HmKuZU2m457wplI0GJizw2qEMuOiBqvuAk35bWmc1Xr64HfUYL4ra     jq回车事件
http://www.php100.com/html/program/jquery/2013/0905/5798.html       jquery回车提交表单事件代码

http://www.runoob.com/jquery/jquery-plugin-validate.html    jQuery Validate 插件为表单提供了强大的验证功能

http://www.superslide2.com/             Tab图、焦点图实现插件

http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html    CSS动画简介
http://leaverou.github.io/animatable/           CSS属性transition 具体的效果

http://www.dowebok.com/98.html              animate.css – 齐全的CSS3动画库

http://www.cnblogs.com/lhb25/category/146075.html   CSS3全面的资料查看分享
http://www.yyyweb.com/350.html              Web 开发中很实用的10个效果【源码下载】

http://www.yyyweb.com/demo/parallax-slider/     视差滚动滑块

http://www.yyyweb.com/demo/textillate/          文字效果
http://www.yyyweb.com/demo/ball-pool/           小球效果

http://www.yyyweb.com/demo/inner-show/caption-hover.html    七种酷炫的鼠标悬停效果
http://www.cnblogs.com/lhb25/p/15-inspiring-examples-of-css-animation-on-codepen.html   赞!15个来自 CodePen 的酷炫 CSS 动画效果


http://tool.oschina.net/commons?type=2      HTML特殊转义字符对照表

http://www.cnblogs.com/xiezhengcai/archive/2012/02/09/2343543.html  html中返回上一页

http://www.holybible.or.kr/BIBLE_cgb/       圣经

https://tinypng.com/            在线压缩图片
http://www.cnblogs.com/58top/archive/2012/11/29/online-image-compression-optimization-tools.html    web开发人员应该知道的10个优秀的在线图像压缩和优化工具

http://www.oschina.net/         开源中国社区(一级棒)
http://plugins.jquery.com/          jQuery插件官网

http://www.sucaihuo.com/            素材火素材网站
http://html5demos.com/          H5Demos
http://fmbip.com/litmus         HTML5和CSS3的兼容性
http://ued.baidu.com/?p=894         HTML 5 & CSS 3的新交互特性
http://jquerycards.com/         1000个高品质的jquery插件库
http://tool.css-js.com/         CSS, JavaScript 压缩, 美化, 加密, 解密
http://cdn.code.baidu.com/          百度静态资源库
http://www.shejidaren.com/examples/tools/css-unicode-font/  CSS中文字体对照表
http://htmlarrows.com/          特殊符号转义
http://weibo.com/p/1001603918286487198847?from=singleweibo&mod=recommand_article    最新的20个电子商务营销网站设计,HTML5响应式官网
http://www.51cto.com/           51CTO技术论坛
http://www.iplaysoft.com/flux.html      护眼软件
http://wenku.it168.com/wenji/2486       揭秘百度核心技术:53位专家纯干货分享
https://www.zhihu.com/question/22951927 知乎前端学习资源整合
http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/javascript-tutorial-list.html     JAVASCRIPT系列教程栏目列表
http://www.htmleaf.com/Demo/201604293407.html   Swiper-强大的移动手机端幻灯片插件演示
http://www.htmleaf.com/         jquery 之家
http://www.jq22.com/search?seo=表单验证 jquery插件库表单验证插件搜索
http://www.jq22.com/yanshi853       表单验证插件 Validform 文档、API
http://www.uimaker.com/         UI制造者
http://www.blueidea.com/tech/web/2010/8160.asp#comment  22个HTML5的初级技巧
http://www.blueidea.com/tech/web/2010/8196.asp#comment  你需要熟知10个的CSS3属性
http://bbs.blueidea.com/thread-3031823-1-1.html 平时收集的一些有关UED的团队和个人博客
http://www.oschina.net/news/28082/10-javascript-form-validate?from=rss  10个强大的Javascript表单验证插件推荐
http://jquerycards.com/ui/scrolling/parallax-js/    视差滚动插件
http://zhidao.baidu.com/link?url=Rlnu1zxiUvyqfwZr65l9q5HBTdhteQXPTm-j_bYh77jA-RqgvWn3xXtv7Cr7jv4GVDOgNcoQ5snO-EKRLA-7JX09uUofJA4lq2pov0icqre    三个函数轮回执行
https://popmotion.io/           js动画
http://joanclaret.github.io/jcSlider/       CSS动画
http://jquerycards.com/         jauery插件
http://hao.shejidaren.com/          设计导航
http://www.jb51.net/article/41131.htm       jQuery父级以及同级元素查找介绍
http://code.ciaoca.com/jquery/kxbdmarquee/  js 无缝滚动
http://code.ciaoca.com/jquery/wookmark/ js 瀑布流插件
http://www.jianshu.com/p/e7bb97218946   20个正则表达式
http://www.gogeeks.cn/  极客导航
http://h5edu.cn/    免费HTML5基础视频
http://demo.lanrenzhijia.com/2014/city0605/
http://www.sucaihuo.com/jquery/0/34/demo/
http://sc.chinaz.com/jiaobendemo.aspx?downloadid=1412691419688
http://www.jq-school.com/Detail.aspx?id=64
http://www.jq22.com/yanshi779
http://www.jq-school.com/Detail.aspx?id=272         Jquery表单验证插件
http://www.jq-school.com/Detail.aspx?id=64          Jquery特效
http://www.admin10000.com/Document/31.html          CSS实现背景透明,文字不透明(兼容各浏览器)
http://blog.csdn.net/honglei_zh/article/details/41317097        html页面 在ie 浏览器下页面显示变形
http://www.cnblogs.com/kiter/archive/2013/02/25/2932157.html    HTML 5 video 视频标签全属性详解
http://www.zhangxinxu.com/wordpress/2010/03/every-browser-support-html5-video/  让所有浏览器支持HTML5 video视频标签
http://reeoo.com/           前端牛逼特效网站
http://caibaojian.com/links     前端网址导航
http://f2er.club/           前端人的俱乐部
http://www.ycku.com/        瓢城Web俱乐部
http://www.php100.com/html/it/qianduan/2016/0218/8991.html  干货|移动端H5前端性能优化
http://www.frontopen.com/331.html       基于display:table的CSS布局
http://www.w3cplus.com/solution/css3content/css3content.html    css3 :before  :after  content 生成内容
http://www.w3chtml.com/html/character.html      html转义字符
http://blog.csdn.net/abeetle/article/details/39928487   解决display:inline-block 出现的间隙
http://www.jb51.net/article/30044.htm                                    jQuery之$(document).ready()使用介绍
http://www.css88.com/archives/297                                        CSS Sprite在线生成器
http://www.itxueyuan.org/view/6309.html                               JavaScript三目运算
http://blog.csdn.net/you23hai45/article/details/50094619      HTML5绘制空心的文本
http://blog.csdn.net/you23hai45/article/details/50094497      HTML5绘制实心的文本
http://blog.csdn.net/you23hai45/article/details/49254145      JavaScript 开发的45个经典技巧
http://www.xwbetter.com/font-family/                                    代码字体英文
http://www.swiper.com.cn/                                                      Swiper常用于移动端网站的内容触摸滑动中文网
http://www.swiper.com.cn/usage/index.html                           Swiper使用方法
http://swiper2.swiper.com.cn/demo/3dflow/index.html          Swiper 3D flow插件演示
http://swiper2.swiper.com.cn/demo/smooth/index.html         Swiper Smooth Progress插件演示
https://segmentfault.com/q/1010000004449045                    CSS样式 font-size:62.5% 在不同浏览器的问题
https://segmentfault.com/q/1010000002411895/a-1020000002422732    CSS样式中用 font-size:62.5% 的原因
http://caniuse.com/#feat=rem                                                 rem在各大浏览器中的样式
http://www.xwbetter.com/talk-rwd/#more-731                      概谈一下响应式网站设计及响应式前端框架
http://blog.csdn.net/freshlover/article/details/12132801        史上最全的CSS hack方式一览 
http://www.html5cn.org/                                                          HTML5中国(全面)
http://bbs.html5cn.org/forum.php                                           H5论坛(资源)
http://www.html5cn.org/article-9292-1.html                           pageSwitch-支持121种过渡效果的JavaScript页面切换插件
http://bbs.html5cn.org/thread-147913-1-2.html                     10种免费学习编程的好地方
https://developer.mozilla.org/zh-CN/                                      开发者全面教程文档
http://www.icodeku.com/                                                         代码库
http://blog.csdn.net/bluestarf/article/details/40652011          HTML CSS 特殊字符表 
http://blog.sina.com.cn/s/blog_569eb4a80101ba0l.html        CSS字体与段落属性
http://hao.jobbole.com/                                                          编程资源大全
https://github.com/jobbole/awesome-css-cn                         CSS 资源大全中文版
https://github.com/jobbole/awesome-javascript-cn               JavaScript 资源大全中文版
https://github.com/jobbole/jquery-tips-everyone-should-know      前端开发者都应知道的 jQuery 小技巧
http://www.bootcss.com/p/buttons/                                      按钮CSS 样式库
http://www.superslide2.com/                                                  TouchSlide 是纯javascript打造的触屏滑动特效插件
http://caibaojian.com/t/html5                                                 Canvas的动画特效
http://caibaojian.com/html5-video-for-everybody.html?wb  HTML5兼容所有浏览器的视频播放代码
http://www.cnblogs.com/hannover/archive/2010/11/28/1890082.html     15个基于WEB的HTML编辑器
http://www.runoob.com/                                                        菜鸟工具
http://finalshares.com/read-7559-1?qq-48                            基于Bootstrap扁平化的后台框架Ace
http://finalshares.com/                                                            极分享程序猿代码  干货
http://w3cschool.codecloud.net/                                            程序员学习资料
https://github.com/dypsilon/frontend-dev-bookmarks        老外总结的前端开发资源  
https://github.com/JacksonTian/fks                                       详细记录 了前端工程师牵涉到的各方面知识
http://devework.com/sublime-text-3.html                             sublime-text-3文本编辑器破解方法
http://baike.baidu.com/link?url=Vfm4L5x6Byyp6QQCXAaQuNa3GqyLsS64WGz25O3OvDD7HgBxlE1mhj7gEQU51RviGZcUtYhmmHpwlZ16NOs89K      Sublime Text使用方法
http://www.eer3.com/                                                   Web技术学习网
http://www.excelxue.com/forum-51-1.html                           Web前端学习网
http://code.tutsplus.com       http://www.sitepoint.com/       有各种各样的教程 
https://guides.github.com/activities/hello-world/                  github 账号
http://www.cnblogs.com/lvdabao/p/5229640.html              前端工程师是怎样一种职业
http://www.lianpuie.com/home.php                                      脸谱账号网址
http://blog.csdn.net/you23hai45/article/details/49094583   border-style有哪些值?这些值的作用
http://blog.csdn.net/you23hai45/article/details/49079445   JavaScript如何调用CSS属性?
http://blog.csdn.net/you23hai45/article/details/49078767   如何对网页的加载进行性能优化
http://blog.csdn.net/you23hai45/article/details/49052887   列出display的值,并说明它们的作用
http://blog.csdn.net/you23hai45/article/details/49052753   CSS设置DIV居中
http://blog.csdn.net/you23hai45/article/details/49051449    link 和@import 的区别
http://blog.csdn.net/you23hai45/article/details/49051285    块级元素和行内元素的区别
http://blog.csdn.net/you23hai45/article/details/49051179    块级元素、行内元素和空元素(void)标签
http://blog.csdn.net/you23hai45/article/details/48529607    JavaScript字符串数值比较问题
http://blog.csdn.net/you23hai45/article/details/48395907    JavaScript所有保留字
http://blog.csdn.net/you23hai45/article/details/48395343    HTML5和HTML4之间的区别
http://www.oschina.net/                                                          开源中国社区
https://github.com/                                                                 全球开源最大社区
http://blog.csdn.net/you23hai45/article/details/47780339     JavaScript替换字符串中最后一个字符 
http://blog.csdn.net/you23hai45/article/details/47325943     JS时间格式化出现2015-02-07 hh:12:30 
http://blog.csdn.net/you23hai45/article/details/44997319     CSS3的[att$=val]选择器 
http://blog.csdn.net/you23hai45/article/details/44997215     CSS3的[att^=val]选择器 
http://blog.csdn.net/you23hai45/article/details/44997041     CSS3的[att*=val]选择器 
http://blog.csdn.net/you23hai45/article/details/44996909     CSS3的[att=val]选择器 
http://blog.csdn.net/you23hai45/article/details/44908681     超链接a标签的属性target的可选值有哪些以及区别 
http://blog.csdn.net/you23hai45/article/details/44908063     JavaScript常用对象有哪些 
http://blog.csdn.net/you23hai45/article/details/44907861     form表单中的input有哪些类型
http://blog.csdn.net/you23hai45/article/details/44907671     CSS精心整理的面试题 
http://blog.csdn.net/you23hai45/article/details/44907377     jquery选择器
http://blog.csdn.net/you23hai45/article/details/44657521     JavaScript禁止浏览器默认行为
http://blog.csdn.net/you23hai45/article/details/44629027     如何利用JavaScript遍历JSON数组 
http://blog.csdn.net/you23hai45/article/details/44428315     HTML5之contenteditable属性 
http://blog.csdn.net/you23hai45/article/details/44263415     HTML5新增与结构有关的元素 
 http://blog.csdn.net/you23hai45/article/details/44263177    HTML5之Canvas画圆形
http://blog.csdn.net/you23hai45/article/details/44262719     HTML5之Canvas画正方形 
http://blog.csdn.net/you23hai45/article/details/44230037     JavaScript DOM对象和JQuery对象相互转换 
http://blog.csdn.net/you23hai45/article/details/44229275     JavaScript和JQuery获取DIV的值 
http://blog.csdn.net/you23hai45/article/details/44024703     常用开发框架以及打包工具 
http://blog.csdn.net/you23hai45/article/details/9229371        jQuery实现表格间隔色 
http://blog.csdn.net/you23hai45/article/details/42198613      HTML5不允许写结束标记的元素 
http://blog.csdn.net/you23hai45/article/details/38828637      利用jquery移除和添加图片
http://blog.csdn.net/you23hai45/article/category/1470181    JavaScript   125个案例
http://blog.csdn.net/powertoolsteam/article/details/50555818    JavaScript 常用功能总结  
http://blog.csdn.net/powertoolsteam                                       前端大牛博客
http://bbs.csdn.net/topics/300227730                                      WEB前端交互快速开发指南
http://devework.com/smashingbook-javascript-jquery.html   《众妙之门:JavaScript 与 jQuery 技术精粹》部分要点摘录
http://devework.com/tool#d-csspacker                                    前端工具箱
http://devework.com/                                                                做一枚极客的网站
http://devework.com/font-diao.html                                         国内常用网站、应用logo 的WebFont Icon(svg格式)
http://devework.com/webfont-render.html                               WebFont 三宗罪之二:吹毛求疵的WebFont 渲染差异
http://36kr.com/                                                                         让创业更简单  创业资讯
http://devework.com/css3-target-dropdown.html                     巧用CSS3 :target 伪类制作Dropdown下拉菜单(无JS) 
http://devework.com/mobile-fontend-dev.html                         移动Web 开发中的一些前端知识收集汇总
http://devework.com/ios-web-app.html                                     将你的网站打造成一个iOS Web App
http://devework.com/jquery-builder.html                                   jQuery Builder:jQuery 库的精简之道
http://devework.com/link-add-favico.html                                 在链接前面自动添加favicon 图标(jquery)
http://devework.com/snow-javascript-code.html                       送上段模拟圣诞节下雪的javascript 代码
http://devework.com/3-responsive-html-email-template.html   响应式 HTML 邮件制作之三个实例
http://devework.com/d3-trianglify-low-poly.html                     【DeveMobile实例】d3.js 与Trianglify 制作SVG格式Low-Poly 特效
http://devework.com/ios-safari-float-bug.html                           国内环境下前端网页开发的几个“中国特色”代码
http://devework.com/flat-component-psd.html                          一组扁平化组件推荐下载(PSD 格式)
http://devework.com/ipad-tablet-psd-template-download.html  八个 iPad 平板电脑PSD 模板下载(可用于展示网页作品)
http://devework.com/eight-showwork-psd-template-download.html    八个具有可扩展性的作品展示PSD 模板下载
http://devework.com/imac-psd-template-download.html           iMac 桌面一体机PSD 模板下载(可用于展示网页作品)
http://devework.com/rainyday-js.html                                         rainyday.js——超逼真全屏雨滴模拟插件
http://devework.com/tryjquery.html                                             jQuery官方jQuery 入门教学视频:TryjQuery(简体中文版下载)
http://devework.com/fontello-web-fo-font-face.html                  Fontello:免费Web-font 图标大集合(font-face 图标集)
http://devework.com/jquery-weather-clouds-plug-in.html          清新唯美的jQuery天气预报插件(网页天气预报插件)
http://devework.com/thecodeplayer.html                                     TheCodePlayer:一个在线演示代码编写过程的网站
http://devework.com/yahoo-weather-icon.html                            精致清新华丽,雅虎天气图标下载
http://finalshares.com/read-6968                                                  Bootstrap快速上手
http://levi.yii.so/archives/4857                                                       兼容移动端的轮播插件 – Camera
http://caibaojian.com/mobile-meta.html                                       移动前端头部标签(HTML5 head meta)
http://www.bitbug.net/                                                                  在线制作ico图标
http://www.360doc.com/content/14/0724/11/16276861_396699901.shtml#   iScroll 4.2.5 中文API
http://iscrolljs.com/                                                                         iscrolljs  官网
http://blog.csdn.net/sweetsuzyhyf/article/details/44195549/        iscrolljs
https://segmentfault.com/                                                              编程问题大全
http://sfcd.com/                                                                              炫酷特效
http://www.jq22.com/                                                                     JS插件库
http://caibaojian.com/learning-javascript.html                               学习JavaScript的经验之谈
http://jingyan.baidu.com/article/acf728fd1c45eaf8e410a36d.html    怎样快速破解rar解压密码!
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=402723062&idx=1&sn=9d5967fbc36a2805400371346f25a0c6&scene=23&srcid=0316gZWGqutJWah6ThwNKlcd#rd      CSS实现垂直居中的常用方法
http://www.php100.com/html/it/focus/2014/1128/7935.html      全栈开发必备的10款Sublime Text 插件 
http://www.cnblogs.com/Rising/p/3741116.html                           安装Sublime Text 3插件的方法
http://echarts.baidu.com/echarts2/index.html?qq-pf-to=pcqq.group     地图可视化
http://echarts.baidu.com/?qq-pf-to=pcqq.group                           地图
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=402838889&idx=1&sn=ef85a60c11c24f13b310e8c553ee03d2&scene=23&srcid=0322P1eOymRfNh6P0DclYVXW#rd           2016年Web前端面试题目汇总
http://www.php-note.com/article/detail/72                                     JavaScript 书写规范
http://www.php-note.com/article/detail/154                                   JavaScript 实践错误实例
http://blog.csdn.net/vipzjyno1/article/details/21039349/               Android APK反编译就这么简单
http://blog.csdn.net/dc15822445347/article/details/23288367      javascript基础知识梳理-Number与String之间的互相转换
https://www.zhihu.com/question/20790576                                   大公司里怎样开发和部署前端代码?
http://www.xuebuyuan.com/category/web前端                              学步园WEB前端
http://zhidao.baidu.com/link?url=FsdFxDc9CBxeoY32aJOmltx5mBcSkNk4oRMX7pN4DWB-4UYYmuMQ4eUIzquPid4FVfpFWi9I3msH3qIX6kSvjyOSaZqJN3B08iCRqOzq4qm    jquery获取input标签的value
http://www.jb51.net/article/24580.htm                                            jquery获取input的value问题说明
http://www.jb51.net/css/228878.html                                              CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
http://www.w3cplus.com/content/css3-transform                 CSS3 Transform
http://sawthedawn.lofter.com/post/132bed_853f0e                        CSS属性:vertical-align
http://bbs.csdn.net/topics/391860495                                             手机端禁止 div 水平滑动
http://sicangziti.com/                                                                        私藏字体
https://segmentfault.com/q/1010000004874572                             移动端页面全屏显示
http://baike.baidu.com/link?url=5lMUk1uHamtV-1kBi4jBG_Z5q_LuAUPEM22Mqu0MLrqCI5M9m9bVfEYB3yQ3MtZ_iwbdurEvC3cbtkti8sxNKK    网络爬虫概述
http://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=1484   -webkit-appearance: none;   自定义标签其他样式,适用于所有有自带样式的标签
http://www.haorooms.com/post/input_file_leixing                HTML5的 input:file上传类型控制
http://app.baidu.com/widget?appid=134026                               ICO图标CUR光标制作
http://www.helloweba.com/view-blog-48.html                 jqTransform:呈现更美的表单
http://www.mycodes.net/153/7640.htm                    HTML5用户注册页面模板
http://www.js-css.cn/a/css/template/reglogin/                  漂亮支持响应式手机端网站登录页面HTML模板下载
http://down.chinaz.com/soft/37838.htm           创意几何色块html5网站
http://down.chinaz.com/soft/37813.htm           html5响应式摄影网站系统(带手机版)
http://down.chinaz.com/soft/37763.htm#down          html5自适应企业网站源码
http://down.chinaz.com/soft/34496.htm           同城多用户商城(生成html无限版)
http://down.chinaz.com/soft/37675.htm           html5七夕情人节送花卡通短片特效
http://down.chinaz.com/soft/37626.htm           HTML5响应式新闻文章整站
http://down.chinaz.com/soft/37589.htm           HTML5自适应企业通用模板源码
http://down.chinaz.com/soft/37519.htm           农业网站dede模板(html5)
http://down.chinaz.com/soft/37500.htm           帝国CMS视觉 HTML5自适应模板
http://down.chinaz.com/soft/37240.htm           bootstrap响应式后台html模板源码
http://down.chinaz.com/soft/37309.htm           HTML5点击添加商品购物车代码
http://down.chinaz.com/soft/35582.htm           极品HTML5网络建站公司模板源码(包含源文件)
http://down.chinaz.com/soft/35719.htm           html5展示型企业网站源码
http://down.chinaz.com/soft/34939.htm           html5网页
http://blog.csdn.net/jyy_12/article/details/9851349     html5表单上传控件Files API

http://webcenter.hit.edu.cn/articles/2009/05-10/05080502.htm    JS在firefox和IE下差异及解决方案

                    
http://www.cnblogs.com/gaoweipeng/archive/2010/04/10/1708873.html   几款浏览器兼容性测试工具

http://www.js-css.cn/a/html5/study/2015/0405/1462.html      碉堡的html5粒子动画表白特效

http://blog.csdn.net/aerchi/article/details/50582270                        js 把反斜杠\转换成正斜杠/
http://www.jq22.com/jquery-info1845                                              jquery图片上传
http://www.jq22.com/jquery-info1604                         jquery多图片上传
http://www.jq22.com/yanshi2346                                                      在线 头像预览 裁切
http://www.jq22.com/jquery-info3419             图片上传插件localResizeIMG
http://www.jq22.com/jquery-info6029             threesixty.js360度产品图片预览jQuery插件
http://www.jq22.com/jquery-info5302             百度上传插件Web Uploader
http://www.jq22.com/jquery-info4496             瀑布流图片布局以及打开点击图片动画特效

http://www.jq22.com/jquery-info698              京东产品详细页图片放大效果
http://www.jq22.com/yanshi2099              淘宝图片放大镜

http://www.jq22.com/jquery-info125              jquery图片画廊(超炫)
http://www.jq22.com/jquery-info1004             视差图片展示特效
http://www.jq22.com/jquery-info313              3D图书本打开全屏翻页预览效果
http://www.jq22.com/yanshi621               CSS3三角形图片展示
http://www.jq22.com/yanshi2644              一款让你不得不惊叹的图片展示效果
http://www.jq22.com/yanshi5225              超酷的照片墙展示效果
http://www.jq22.com/yanshi2643              3D图片旋转展示
http://www.jq22.com/yanshi886               html5极速3D立体式图片相册切换效果
http://www.jq22.com/jquery-info2170             3种风吹图片jquery堆叠图片切换效果插件
http://www.jq22.com/jquery-info2185             纯css3实现的创意图片放大镜
http://www.codefans.net/jscss/code/3752.shtml           36种漂亮的CSS3网页按钮Button样式



http://runjs.cn/                                                      JS效果交流论坛    
http://runjs.cn/detail/pc4xyitt                                百度地图搜周边
http://runjs.cn/code/vvxiaalz                                 H5 图片预览
http://runjs.cn/detail/xsbmwva2     擦有雨滴的窗户
http://runjs.cn/detail/xlaf3zsk             颜色选择插件demo
http://runjs.cn/detail/31obbi8n                               图片 + 文字 切换
http://runjs.cn/detail/zidjlhoh                                  放大镜效果
http://runjs.cn/detail/68qzvqjq                                CSS3图片悬停效果
http://runjs.cn/detail/5lilpioe                                   刮刮卡
http://runjs.cn/detail/6vgwfuhx                               闪闪
http://runjs.cn/detail/jc7ucsie                                  鼠标移动方向插件
http://runjs.cn/detail/67pnwvxa      Jquery插件 实现球面滚动效果
http://runjs.cn/detail/fkgwffty                                  Swiper+jQuery Timing插件,翻页+文字淡入效果!
http://runjs.cn/detail/34b6eom7                               jquery弹性滑动导航菜单
http://runjs.cn/detail/ndaa9ggp                               多种切换效果的相册
http://runjs.cn/detail/ismveyhv                                 朝鲜日报
http://runjs.cn/detail/axkhky3t                                  百度地图测试
http://runjs.cn/detail/gdoqeg5m                               三角形
http://runjs.cn/detail/qr1j03da                                   偏冷门css 解析
http://runjs.cn/detail/9p2lrzux                                     区分单双击事件
http://runjs.cn/detail/dxohs8eq                                    CSS3 发光字体
http://runjs.cn/detail/mezklvbu                                     地区选择器
 http://runjs.cn/detail/gob8xwhw                                    Proton粒子demo
http://runjs.cn/detail/cb7un3lh          Extjs View 实现两个View之间的item拖拉 
http://runjs.cn/detail/fwyjjieh                                       小抽奖游戏
http://runjs.cn/code/g9pgdcy4                                    伪类选择符 E:target  css选择器例子         
http://runjs.cn/code/yzsh0q0b                                     定义多重背景图片
http://runjs.cn/detail/tq4wvrez                                     可伸缩搜索框
http://runjs.cn/detail/z8ofnxng                                      Game of Life
http://runjs.cn/detail/twt4tomi                                       斜导航
http://runjs.cn/detail/rg8wxxva                                     html5 年会抽奖程序
 http://runjs.cn/code/k6vafjkf                                         ie6 input file 
http://runjs.cn/detail/ef6ncg0x                                       Textarea 高度自适应 jQuery 插件,兼容所有浏览器
http://runjs.cn/detail/to6neutz                                         CSS 实现元素背景渐变
http://runjs.cn/detail/szjiaux7                                          CSS实现图片灰度效果
http://runjs.cn/detail/5yzrthm4                                       聪明的小悬挂,根据页面内容控制悬挂的定位上限和下限。
http://runjs.cn/detail/rvduo37j                                         携程网日历控件
http://runjs.cn/detail/pvanlwzc                                         setTimeout 边框闪动
http://runjs.cn/detail/ojm8jis7                                   HTML 表单 Placeholder 属性兼容处理。兼容IE6+及其他非IE浏览器
http://runjs.cn/detail/lrmdoqsa              SewisePlayer侧栏广告播放
http://runjs.cn/detail/s1su3yju                                          响应式布局
http://runjs.cn/detail/fiplmfhm                                         bootstrap响应式网页设计
http://runjs.cn/detail/jr4pgdnp                                         选项卡切换
http://runjs.cn/detail/zddbf7pe                                         Pager分页控件 
http://runjs.cn/detail/ywpzunnr                                         方向感知动画
http://runjs.cn/detail/u1wj1jux                                           3D动态玫瑰
http://runjs.cn/detail/8cqralqo                                            CSS 3D效果菜单
http://runjs.cn/detail/vz812ovq                                            类似windows开机的动态效果
http://runjs.cn/detail/71iczdeh                                             HTML5烟花
http://runjs.cn/detail/8fdmculn                                             自定义input file 样式
http://runjs.cn/detail/9kjuowwz                                              立体3D模型
http://runjs.cn/detail/fswjwdu7                                            Transition时间过渡曲线
http://runjs.cn/detail/zdtjlwmr                                              鼠标滑过图片半透明,文字从左边划出 
http://runjs.cn/detail/z4jympuy                                             AdWindowDemo
http://runjs.cn/detail/lvfgxn49                                                3d饼图
http://runjs.cn/detail/crysffkh             漂亮的文件上传表单
http://runjs.cn/detail/kgawqf8s                                               多皮肤悬浮QQ在线客服jQuery插件 
http://runjs.cn/detail/tvqxftuj                                                   仿天猫轮播
http://runjs.cn/detail/tvqxftuj                                                     仿天猫轮播





http://www.oschina.net/p/bootstrap-file-input              这是一个增强的 HTML5 文件输入控件,是一个 Bootstrap 3.x 的扩展,实现文件上传预览,多文件上传等功能。


https://api.jquery.com/lt-selector/               $("ul.rating li:lt("+n+")")    选择 星星  评价案例 最重要的例子  

https://segmentfault.com/a/1190000003110300                            JS常用库解密-FastClick
https://segmentfault.com/search?q=click事件                                 click 事件
http://blog.csdn.net/u011413061/article/details/50172367           关于Safari里quickOn绑定click事件闪屏问题的解决方案            
https://www.douban.com/note/315479098/                                  移动互联网终端的touch事件,touchstart, touchend, touchmove
http://blog.csdn.net/freshlover/article/details/19123335                javascript——touch事件介绍与实例演示
http://www.th7.cn/Program/IOS/201503/410845.shtml                 解决iOS的Safari浏览器解析绑定了onclick事件闪烁的问题
https://segmentfault.com/a/1190000000339907                            Mobile Web 开发之百味良药
https://github.com/ftlabs/fastclick                                                   fastclick事件
http://www.xuebuyuan.com/2174858.html                                     移动端WEB开发,click,touch,tap事件浅析
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=402953900&idx=1&sn=dea8616a25236641e08337eff85b6921&scene=23&srcid=0331JkX3iJGB5WdcStIQea3E#rd       以20像素为基准的CSS网页布局实践分享
http://www.jb51.net/article/58570.htm                                            Chorm 节点调试
http://zhidao.baidu.com/link?url=lnv2U9WYPWHdBWy58cCFZ6zUSG_exiJ0eEq-ZW7De1IEYLC4kDXC6r0Vb5A-788NDp2Ir8wEsuiSrBGAwQklNa    简述常用的网络服务及提供服务的默认端口


http://blog.sina.com.cn/s/blog_693de6100102vi3w.html                iOS开发】UIWebView与JavaScript(JS) 回调交互 


https://segmentfault.com/                                                         知识大全


http://www.zentao.net/                                                                    管理软件——禅道官网
  
http://www.bttiantang.com                                                              电影下载网站
http://www.panduoduo.cc/                                                              盘多多官网
http://wenku.baidu.com/view/699b0045e518964bcf847c84.html?qq-pf-to=pcqq.c2c    如何查服务器的IP
http://mobile.zol.com.cn/572/5729655.html                                   苹果2016春季发布会

http://www.oschina.net/news/52033/free-bootstrap-admin-templates    再来 20 个免费的 Bootstrap 的后台管理模板
http://www.apicloud.com/dev?uzchannel=4                                    使用开发工具开发原生APP
                                                                         电商可下载源码
http://www.mycodes.net/20/5744.htm     
http://php.net/manual/zh/ziparchive.open.php                               PHP 论坛资源           


WinHTTrack    扒站软件                   
                    代码欣赏
http://www.shejidaren.com/100-powerful-css-and-js-demo.html           100个惊人的CSS、JS代码技术
http://www.shejidaren.com/top-10-code-and-css-snippets-2014.html    惊人技术!2014年Codepen上最热门的100个code&CSS片段代码
http://codepen.io/                                                                              资源酷站赏析
http://codepen.io/rachsmith/pen/fBoiD                                             超屌的文字变换效果
http://codepen.io/hakimel/pen/vDnmp                                            特效
http://codepen.io/averyvery/pen/IvDLB                                            数字倒数
http://codepen.io/felipedefarias/pen/yiBjr                                         彩色三角颜色变换
http://codepen.io/IanLunn/pen/hysxc                                                Hover 效果
http://codepen.io/V17h3m/pen/vGJpxM                                           色球特效
http://codepen.io/NobodyRocks/pen/qzfoc                                      文字鼠标经过特效

        特效网站
http://my.deejo.fr/en/15/titanium/genevrier/none/none/tree  
https://www.oculus.com/en-us/rift/
https://www.porschemarriage.nl/accept
http://www.kaven115.com/        交互不错


                    插件
http://www.shejidaren.com/lazysizes.html                   响应式图像延迟加载JS插件:lazySizes
http://www.csdn.net/article/1970-01-01/2825439         观测数据的  js 插件


                    桌面
http://yidoubi.com/1566.html                           雨滴桌面



http://yidoubi.com/542.html            实用APP 简介

                    盘多多网盘分享
http://www.panduoduo.net/u/bd-2809738270

http://pan.baidu.com/share/link?shareid=3901230998&uk=2016576516   电子书资源汇总
http://w.qq.com/   web QQ.
http://do189.com/    有意思的网站

http://blog.sina.com.cn/s/blog_5dc8d9a50101b53u.html    几款抓网站的软件

http://cn.office-converter.com/Convert-to-WAV       免费在线文件转换器

https://www.zhihu.com/question/31127495#answer-35890301 打发时间趣站

http://dvd.boxuegu.com/map/50.html?1603zwqqun        博学谷在线前端视频资源

http://www.zhihu.com/question/23931133  如今中国当代文学有什么好的小说吗?

http://zaodula.com/         互联网早读课

http://www.apptuijian.com/archives/805  几款常用的APP翻墙神器
  • 酷站收藏
http://giphy.com/   gif图片

https://www.zhihu.com/question/21073212     国内优秀的响应式WEB网站有哪些(知乎)
    
https://tinypng.com/            在线压缩图片

http://www.juzimi.com/article/28746 《遮天》经典语录

http://mt.sohu.com/20160329/n442689960.shtml        中国这10家慕课网站,您需要知道

https://www.showapi.com/        接口练习网站

http://www.superslide2.com/
http://layer.layui.com/
http://www.htmleaf.com/Demo/201501281290.html
http://v3.bootcss.com/components/
http://www.hcharts.cn/          兼容 IE6+、完美支持移动端、图表类型丰富、方便快捷的 HTML5 交互性图表库
http://echarts.baidu.com/       直观,生动,可交互,可高度个性化定制的数据可视化图表。
http://www.highcharts.com/demo/     Highcharts是一个纯JavaScript编写的jQuery图表插件库。Highcharts提供了简单的方式为您的网站或项目添加动态图表。
http://www.jiathis.com/help/html/jiathis-diy

http://ecomfe.github.io/edp/        开源的EDP来自百度EFE。 在EFE,我们还有其他开源产品:(底部友情链接)
http://www.htmleaf.com/Demo/201608043823.html       功能齐全的jQuery倒计时插件
http://amazeui.org/         中国首个开源 HTML5 跨屏前端框架

http://www.htmleaf.com/Demo/201607293797.html       超酷海洋主题内容切换面板布局特效效果演示(带声音)
http://www.htmleaf.com/css3/ui-design/201605043425.html     6种精美的纯CSS3丝带效果
http://www.htmleaf.com/Demo/201601183037.html       超酷纯CSS3动感手风琴列表ui界面设计效果演示

http://blog.csdn.net/puluotianyi/article/details/39048977       程序员的十个层次
http://blog.csdn.net/puluotianyi/article/details/43952559       【养生】全球公认的最健康作息时间表

http://ourjs.com/       js社区
https://zhuanlan.zhihu.com/p/21910473       学习PHP资源
http://www.admin10000.com/document/8184.html    HTML特殊字符的html、js、css写法汇总
http://php.net/manual/zh/       PHP中文手册 

https://git.oschina.net/fuck_fuck/Bootstrap_dome  git账号
https://ruby-china.org          ruby中国社区
http://www.bootcdn.cn/          bootstrap cdn加速服务
https://git-for-windows.github.io/      git下载网址

http://zhidao.baidu.com/link?url=yM4QTFE2fEE_VFfbDGZx9cdqhgrIRKe4hUTEhzYXBpkfBNishrfLlQFOLJeJDebGAEAVauiQW6HZLsF84rP2SK         电脑常用快捷键大全
http://baike.baidu.com/link?url=U4FP-yrYMeBMCC-HpVqlixlFfDEL4Rd-LO2463bA7zJuhTbijEcQGCoGcED0QtOuAkg6QHkDMgQoWAE3WFEGga        javascript百度百科

    实时资讯前沿  http://36kr.com/
                    设计
https://www.behance.net/                            展示和发现创意作品的网站
http://design.jobbole.com/118305/             2016年45个优秀的网页设计案例欣赏
http://699pic.com/?r=3    图片素材
http://www.alpharobe.com/portfolio  日本灵气设计
http://www.sj33.cn/ 设计之家
http://www.sj33.cn/digital/wysj/201512/44830.html   20个国外创意电商网站
http://jy.sccnn.com/?act=view&id=4780&mod=pad   设计经验/教程分享 _ 素材中国文章jy.sccnn.com
http://www.haosou.com/s?ie=utf-8&src=know_side_nlp&q=%E5%85%A8%E7%90%83%E8%AE%BE%E8%AE%A1%E7%BD%91&ob_ext=%7B%22rsv_cq%22%3A%22%5Cu56fd%5Cu5916%5Cu8bbe%5Cu8ba1%5Cu7f51%5Cu7ad9%22%2C%22rt%22%3A%22%5Cu7f51%5Cu7ad9%22%2C%22rclken%22%3A%22%5Cu5168%5Cu7403%5Cu8bbe%5Cu8ba1%5Cu7f51%22%7D  全球素材
http://shijue.me/home  视觉中国
http://xiaba.shijue.me/album/4d4d0d8d4b795919590001b8.html  大神珍藏素材
http://shijue.me/show_text/54d84ff78ddf87084a053b73  四个PS技能升级技巧
http://97ui.com/  优界网
http://hao.shejidaren.com/ 
http://www.uisdc.com/ui-ps-cc-skill                       PS 提升技巧
http://www.sucaitianxia.com/                                  素材天下


                                前端

http://blog.jobbole.com/45574/          谷歌 Web 开发最佳实践手册
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool Flex 布局教程:语法篇
http://download.csdn.net/detail/wx247919365/8741243     css sprite雪碧图生成小工具 v4.3
http://www.w3cfuns.com/ 前端网
http://www.17sucai.com/category/1  htnl素材
https://www.apachefriends.org/  PHP开发软件下载地址
http://sc.chinaz.com/jiaoben/tupiandaima.html   站长素材  代码素材
https://developer.mozilla.org/zh-CN/ 开发者资源网站
https://www.qianduan.net/page/2/ (腾讯)前端观察
http://caibaojian.com/toutiao/5417  称职的前端开发工程师
http://caibaojian.com/  前端开发博客
http://www.frontopen.com/288.html  css3中webkit-box的用法(流体布局)
http://www.php-note.com/  PHP开发笔记
http://www.codesec.net/  各类技术知识大全

http://www.excelxue.com/thread-3961-1-1.html             让网页效果更有风格的CSS滤镜

http://www.xwbetter.com/font-family/  代码字体英文

http://caibaojian.com/links   前端网址导航
http://www.17sucai.com/pins/tag/6491.html  代码素材下载要钱的
http://www.bubuko.com/infodetail-282777.html  移动前端开发总结
http://wex5.com/cn/wex5/?utm_source=Baidu  H5  APP 开发软件WeX5
http://wex5.com/cn/1-wex5#04   WeX5开源软件教程
http://www.oschina.net/  开源中国社区
http://tool.oschina.net/   在线压缩代码
http://www.cnblogs.com/asqq/archive/2012/04/13/2445912.html         移动端 Media Queries 媒体查询详解
http://www.moke8.com/article-5657-1.html                CSS3 Media Query实现响应布局
http://www.uisdc.com/firefox-add-ons-for-developers                 献给网页开发者的20款Firefox插件
http://codepen.io/supah/pen/pgGYBe              H5代码写出的计算器
http://codepen.io/rafaelcastrocouto/pen/obQJwb              H5写出的小跑车游戏
http://codepen.io/fabean/pen/JGwXNN             H5写出来的碰撞小游戏
https://www.zhihu.com/question/46939006             内有什么好的前端学习网站推荐?(知乎)

http://hao.shejidaren.com/    (设计)前端开发 资源网站

http://tool.lanrentuku.com/guifan/ui.html       iPhone/iPad/Android UI尺寸规范

http://codepen.io/  前端特效网站(大牛很多)
http://www.w3school.com.cn/   w3school在线教程
http://www.shejidaren.com/examples/tools/css-unicode-font/  CSS中文字体对照表
http://www.jquery123.com/  jQuery API 中文文档
http://learn.jquery.com /   jQuery 学习中心
http://www.jb51.net/article/64303.htm    js实现touch移动触屏滑动事件 (没成功)
http://www.jb51.net/article/72823.htm     浅谈javascript的Touch事件 
http://img.jb51.net/tag/touch%CA%C2%BC%FE/1.htm   移动端Touch手指滑动事件
http://www.jb51.net/  脚本之家
https://segmentfault.com/   SegmentFault 是一个专注于解决编程问题,提高开发技能的社区


http://www.swiper.com.cn/    Swiper常用于移动端网站的内容触摸滑动中文网
http://www.swiper.com.cn/usage/index.html  Swiper使用方法
http://swiper2.swiper.com.cn/demo/3dflow/index.html   Swiper 3D flow插件演示
http://swiper2.swiper.com.cn/demo/smooth/index.html  Swiper Smooth Progress插件演示

http://www.runoob.com/   菜鸟教程前端(移动端)
http://jquerymobile.com/    jquerymobile 移动框架开发插件
http://jquerymobile.weebly.com/     jquerymobile 移动框架开发插件中文版
http://jquery.com/   jquery官网
http://fanyi.baidu.com/transpage?query=https%3A%2F%2Fjquery.com%2F&source=url&ie=utf8&from=auto&to=zh&render=1&origin=ps   jQuery中文版
http://www.jq22.com/jquery-info122   jquery下载所有版本
http://www.jq22.com/  jQuery 插件库
https://antv.alipay.com/                    阿里数据可视化插件
http://echarts.baidu.com/index.html         百度数据可视化插件
http://jsrun.net/               JSRUN在线编辑器



http://www.cnblogs.com/jston/archive/2013/02/21/2920073.html    jquery mobile常用的data-role类型

http://cli.im/deqr   电脑端二维码扫描

https://segmentfault.com/q/1010000004449045  CSS样式 font-size:62.5% 在不同浏览器的问题
https://segmentfault.com/q/1010000002411895/a-1020000002422732    CSS样式中用 font-size:62.5% 的原因
http://caniuse.com/#feat=rem   rem在各大浏览器中的样式
http://www.xwbetter.com/talk-rwd/#more-731  概谈一下响应式网站设计及响应式前端框架
http://dev.dcloud.net.cn/mui/ui/#mask     hello mui 最接近原生的WebApp 高性能前段框架

http://blog.csdn.net/freshlover/article/details/12132801    史上最全的CSS hack方式一览 
http://blog.csdn.net/freshlover/article/category/1370873    前端开发博客
http://www.cnblogs.com/jianglan/archive/2011/07/17/2108751.html  前端开发博客


zhangdong@larcna.com.cn    Javascript 讲师张东邮箱

http://www.html5cn.org/     HTML5中国(全面)
http://bbs.html5cn.org/forum.php    H5论坛(资源)
http://www.html5cn.org/article-9292-1.html  pageSwitch-支持121种过渡效果的JavaScript页面切换插件
http://bbs.html5cn.org/thread-147913-1-2.html   10种免费学习编程的好地方

https://developer.mozilla.org/zh-CN/    开发者全面教程文档
http://www.easyicon.net/    免费icon下载网站
http://tmooc.cn/web/course_new.html  达内免费课程

http://tieba.baidu.com/p/3483211359   分享一些高清javascript书,豆瓣评分9分以上
http://www.panduoduo.net/s/name/%E8%BE%BE%E5%86%85   达内网盘资源
http://www.icodeku.com/     代码库

http://blog.csdn.net/bluestarf/article/details/40652011     HTML CSS 特殊字符表 
http://blog.sina.com.cn/s/blog_569eb4a80101ba0l.html     CSS字体与段落属性
http://blog.sina.com.cn/s/articlelist_1453241512_9_1.html     前端博客
http://blog.csdn.net/?ref=toolbar_logo   博客主页

http://group.jobbole.com/category/tech/webfront/?utm_source=weixin&utm_medium=weixin_qa#rd  微信前端问题解答库

http://hao.jobbole.com/      编程资源大全
https://github.com/jobbole/awesome-css-cn     CSS 资源大全中文版
https://github.com/jobbole/awesome-javascript-cn      JavaScript 资源大全中文版
https://github.com/jobbole/jquery-tips-everyone-should-know      前端开发者都应知道的 jQuery 小技巧
http://www.bootcss.com/p/buttons/         按钮CSS 样式库
http://www.superslide2.com/      TouchSlide 是纯javascript打造的触屏滑动特效插件
http://caibaojian.com/t/html5      Canvas的动画特效
http://caibaojian.com/html5-video-for-everybody.html?wb       HTML5兼容所有浏览器的视频播放代码
http://www.cnblogs.com/hannover/archive/2010/11/28/1890082.html     15个基于WEB的HTML编辑器
http://www.runoob.com/     菜鸟工具

http://finalshares.com/read-7559-1?qq-48        基于Bootstrap扁平化的后台框架Ace
http://finalshares.com/       极分享程序猿代码  干货
http://w3cschool.codecloud.net/     程序员学习资料
http://w3cschool.codecloud.net/htm5/html5-tutorials.html   H5自学
https://github.com/dypsilon/frontend-dev-bookmarks        老外总结的前端开发资源  
https://github.com/JacksonTian/fks      详细记录 了前端工程师牵涉到的各方面知识
http://devework.com/sublime-text-3.html         sublime-text-3文本编辑器破解方法
http://baike.baidu.com/link?url=Vfm4L5x6Byyp6QQCXAaQuNa3GqyLsS64WGz25O3OvDD7HgBxlE1mhj7gEQU51RviGZcUtYhmmHpwlZ16NOs89K      Sublime Text使用方法
http://www.eer3.com/    Web技术学习网
http://www.excelxue.com/forum-51-1.html     Web前端学习网
http://www.iconsvg.com/     下载SVG图标
http://ourjs.com/detail/551b9b0529c8d81960000007    用纯css改变下拉列表select框的默认样式 
http://www.css88.com/       前端知识网站
http://fex.baidu.com/       百度前端研发部
http://www.alloyteam.com/   腾讯前端团队
http://open.163.com/movie/2013/7/R/R/MA0BCSCR7_MA0BFMBRR.html       加利福尼亚大学洛杉矶分校公开课:社会心理学
https://dribbble.com/slimjimstudios?page=1      一个做插画 gif 的老外
http://felicegattuso.com/projects/datedropper/      最小而有力的
jQuery UI datepicker(日期插件)
http://www.ui.cn/       UI中国(很全的UI知识)
https://clipboardjs.com/    粘贴复制插件
http://www.alloyteam.com/nav/       腾讯 Web前端导航
http://www.opendigg.com/tags/front-end          OpenDigg专注于挖掘优质的开源项目库,通过技术和人工将软件项目分类整理
https://isux.tencent.com/       腾讯ISUX - 社交用户体验设计
http://cssicon.space/#/         用 css3 写的图标网站

                                外国网站
http://code.tutsplus.com       http://www.sitepoint.com/      有各种各样的教程 
https://guides.github.com/activities/hello-world/       github 账号



                前端好文
http://www.cnblogs.com/lvdabao/p/5229640.html      前端工程师是怎样一种职业

http://qiannao.com/file/qq2427876234/ee41c9f8/  屏幕录像专家LXE播放器

http://www.lianpuie.com/home.php   脸谱账号网址

http://www.meishichina.com/     美食中国

http://hao.jobbole.com/         伯乐前端资源



        知乎
https://zhuanlan.zhihu.com/p/22633631       分享几款jQuery.js插件帮你快速开发web前端页面


        github
https://github.com/gkajs/gka            简单的、高效的帧动画生成工具.       官网:  https://gka.js.org/#/?id=gka
http://www.chinaw3c.org/            W3C 中文版官网
http://caniuse.com/     兼容性查询网站
http://webplatform.org      兼容性查询网站
https://developer.mozilla.org/zh-CN/        MDN web docs 在线文档查询
  • 网址
http://10.99.99.206/users/sign_in
帐号:18339835755     密码:123456


背景图片定位:视觉效果不错  url("//img12.360buyimg.com/cms/jfs/t3199/317/811575294/221203/ed816c09/57bfe8d8N158ae747.jpg") center top no-repeat fixed rgb(0, 0, 0)

https://segmentfault.com/q/1010000002654352
http://blog.sina.com.cn/s/blog_c10887ff0101a94l.html        佛说

http://yun.baidu.com/s/1vd0iT

http://giphy.com/   gif图片

http://www.juzimi.com/article/28746 《遮天》经典语录

http://mt.sohu.com/20160329/n442689960.shtml        中国这10家慕课网站,您需要知道

https://www.showapi.com/        接口练习网站

http://www.superslide2.com/
http://layer.layui.com/
http://www.htmleaf.com/Demo/201501281290.html
http://v3.bootcss.com/components/
http://echarts.baidu.com/       直观,生动,可交互,可高度个性化定制的数据可视化图表。
http://www.highcharts.com/demo/     Highcharts是一个纯JavaScript编写的jQuery图表插件库。Highcharts提供了简单的方式为您的网站或项目添加动态图表。
http://www.jiathis.com/help/html/jiathis-diy        网站分享应用插件

http://ecomfe.github.io/edp/        开源的EDP来自百度EFE。 在EFE,我们还有其他开源产品:(底部友情链接)
http://www.htmleaf.com/Demo/201608043823.html       功能齐全的jQuery倒计时插件
http://amazeui.org/         中国首个开源 HTML5 跨屏前端框架

http://www.htmleaf.com/Demo/201607293797.html       超酷海洋主题内容切换面板布局特效效果演示(带声音)
http://www.htmleaf.com/css3/ui-design/201605043425.html     6种精美的纯CSS3丝带效果
http://www.htmleaf.com/Demo/201601183037.html       超酷纯CSS3动感手风琴列表ui界面设计效果演示

http://blog.csdn.net/puluotianyi/article/details/39048977       程序员的十个层次
http://blog.csdn.net/puluotianyi/article/details/43952559       【养生】全球公认的最健康作息时间表

http://cxytiandi.com/       程序员天地
http://ourjs.com/       js社区
https://zhuanlan.zhihu.com/p/21910473       学习PHP资源
http://www.admin10000.com/document/8184.html    HTML特殊字符的html、js、css写法汇总
http://php.net/manual/zh/       PHP中文手册 

https://www.zhihu.com/question/28333225         百度网盘下载限速如何破解

http://blog.csdn.net/kaizi318/article/details/39347133      chrome浏览器无法添加来自此网站的应用、扩展程序和应用脚本

http://www.open-open.com/       深度开源 社区

https://www.douban.com/group/topic/79626520/        .NET基础教程免费学,.NET实战开发教程
    ios 常见问题
http://bbs.phonegap100.com/thread-1440-1-1.html  ios手机号变色
点击有颜色   css 解决 :-webkit-tap-highlight-color: rgba(0,0,0,0);
input 有内阴影 css 解决:-webkit-appearance: none;
http://blog.csdn.net/liu__hua/article/details/40106595      小技巧css解决移动端ios不兼容position:fixed属性,无需插件

    工作中遇见的问题
http://zhidao.baidu.com/link?url=l0-20mbb1VW7720pnEf5c9135zrMXI1r44BiosC3uZPBfeE7hAiYsSsQw84qpY5hkrVStNNWtquEghQk4CzoUK     html table里两个tr之间存在空白 如何去掉
http://zhidao.baidu.com/link?url=Klpg2d5m0N0aCRNTCYUEHB1GzhSTa5F1_W48JUV38fjJSUmIbp1T2PHYmq5JjVL5vzvozKbfFBnuoYRqQWsQ0K-0fBLpl_yKsQ4iRGu90SS
ie  背景透明
http://ioutsider.me/refresh-the-page-to-reload-with-jquery.html     用jquery 刷新 重新加载页面

    移动端
http://blog.csdn.net/wusuopubupt/article/details/21941343       HTML适应手机浏览器宽度
http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651550979&idx=2&sn=55eacdc90bf34b51faada376976ea1e0&scene=0#wechat_redirect   REM : Web App适配的秘密武器
http://web.jobbole.com/87481/               移动端样式小技巧
http://caibaojian.com/flexible-js.html              自适应布局-移动端自适应必备  
http://blog.csdn.net/jyb123/article/details/48261791        移动端干货(一级棒!!!)
http://www.cnblogs.com/xcsn/p/4922562.html          CSS3中的Rem值与Px之间的换算
http://www.cnblogs.com/xiezhengcai/archive/2012/02/09/2343543.html      html中返回上一页
http://caibaojian.com/html5-placeholder-discuzz.html            HTML5 placeholder兼容性探讨
http://demo.lanrenzhijia.com/2015/delete0716/           jquery + jquery mobile 模拟APP侧滑删除效果
http://www.tuicool.com/articles/raeaqm          响应式页面中会用到image标签的srcset属性srcset属性用于设置不同屏幕密度下,image自动加载不同的图片
http://www.cnblogs.com/lykbk/archive/2012/08/09/huhu345545.html     css !important用法CSS样式使用优先级判断


http://www.cnblogs.com/sntetwt/p/3823592.html           jquery如何获取元素的滚动高度
    
    get 知识点
http://www.cnblogs.com/eastday/archive/2010/03/03/1677324.html      JS中Null与Undefined的区别
http://ourjs.com/detail/5383eb8f7610019548000012            JavaScript中NaN的秘密

_str = _str + "<span class='num" + str.substr(i, 1) + "'></span>"   js字符拼接

http://www.cnblogs.com/newsouls/archive/2012/03/02/2377020.html     JS中Date对象getYear()方法和getFullYear()方法区别
http://www.w3school.com.cn/jsref/jsref_split.asp    split() 方法用于把一个字符串分割成字符串数组      JavaScript split() 方法
    Math
http://www.w3school.com.cn/jsref/jsref_abs.asp      abs() 方法可返回数的绝对值        JavaScript abs() 方法
http://www.w3school.com.cn/jsref/jsref_ceil.asp     ceil() 方法可对一个数进行上舍入     JavaScript ceil() 方法
    Number
http://www.365mini.com/page/javascript-number-toexponential.htmJavaScript   Number.toExponential() 函数详解
    Input
http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html     JQuery判断radio是否选中,获取选中值

http://www.365mini.com/page/jquery-toggleclass.htm          jQuery.toggleClass() 函数详解

http://zhidao.baidu.com/link?url=HQ4-gfsQH3luwjhqswvLk6dvEh9kb-dTK7Da5s37pPkOG9Wmo8ih63Owv9S_ESyGXbmq0FRSolEP1IH2G1SCjfPPcVRG6gJMHz0wPngieky    jquery 点击元素以外任意地方隐藏该元素的方法  (先全局点击,再阻止冒泡 event.stopPropagation();)

http://zhidao.baidu.com/link?url=qOY-hhHaRsVbL9bcdYvSC7y9cBCyENjd4QXueYFimMMDNUwbVcwpBhmYbpkMQdq9RU-Pi1za1SlJPuoGjuzJr_         JS里加一个判断,大于多少且小于多少

http://zhidao.baidu.com/link?url=Fw9wp1azySwZspZ7E4CGinu9XnmImOSjWNi8bjEy1GGHrHWbG3Xhx5LevZQl6Pa4kc2-4upLMmR1EVRIRM0oc_   eval(arr.join('+'));          js 数组求和
http://zhidao.baidu.com/link?url=Ypy17diFZTkeOySBDAFib0MixoiW1Buyw_zmdEqm60rY1xOQdxoAIvrhzfM-Ch7Mqp38gmzl9d6an0Jntf1NXW66DTcMC_gp3aUfzn7IueC            input checked的数量
http://www.cnblogs.com/snandy/archive/2011/04/04/2005156.html       JavaScript中清空数组的三种方式


http://www.hdfu.net/index.html          flash 上传头像插件

http://www.cnblogs.com/wangyuelang0526/archive/2012/05/16/2503732.html      HTML <map> 设置图热点(案例来自淘宝商铺)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,451评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,172评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,782评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,709评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,733评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,578评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,320评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,241评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,686评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,878评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,992评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,715评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,336评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,912评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,040评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,173评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,947评论 2 355

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,754评论 1 92
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,315评论 0 11
  • •前端面试题汇总 一、HTML和CSS 21 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? ...
    Simon_s阅读 2,220评论 0 8
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    程序员poetry阅读 16,555评论 32 459
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,754评论 0 2