通过css修改select下拉列表框的默认样式
实现原理很简单，就是通过把浏览器默认的下拉框样式清除，自定义select样式，再把默认的下拉按钮替换为张向右对齐的小箭头图标即可，具体代码如下。
select {
/*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
border: solid 1px #000;
/*很关键：将默认的select选择框样式清除*/
appearance:none;
-moz-appearance:...
10个无版权限制图库图片素材网站分享
这几年关于图片版权索赔的事件不在少数，要避免图片侵权，最简单的办法就是直接从正版图库购买版权图片，对于初创公司而言成本太高。这里给大家整理了10个目前提供免费图片素材资源网站，这些网站的图片质量相当高，大部分为高分辨率，最重要的是，它是免费的，无版权限制哦！
Pixabay
网址：https://pixabay.com/
Pixabay提供可在任何地方使用的免费图片和视频，所有的图像和视频Pi...
使用JS和canvas实现gif动图的停止和播放
HTML5 canvas可以读取图片信息，绘制当前图片。于是可以实现图片马赛克，模糊，色值过滤等很多图片特效。我们这里不用那么复杂，只要读取我们的图片，重绘下就可以。
HTML代码：
<img id="testImg" src="xxx.gif" width="224" height="126">
<p><input type="button" id="testB...
通过CSS或JS实现gif动态图片的停止与播放
到需要可以随时随地停止gif动态图片播放的需求的时候，可以通过下面几种方法实现。
方法一：多img资源控制处理
就是准备2套图片，一个是gif动态图片，还有一个是只有一帧的静止的图片，如jpg图片。然后使用JS来回切换<img>的src值为这两张图片地址，或者通过js实现点击就切换显示两张图片。
这种方法的优点就是兼容性强，所有浏览器都可以实现停止效果。然而这种方法有个局限，就是暂停...
使用IE11浏览器调试IE7、IE8、IE9、IE10浏览器
现在的操作系统使用的IE浏览器版本都比较高，有时候制作网页的时候需要测试低版本IE浏览器的兼容问题会显得比较麻烦，部分人会使用IEtest软件测试，但该软件体验发现并不好，其实上IE11浏览器本身就提供了IE7、IE8、IE9、IE10浏览器的测试功能。
1、打开IE浏览器，点击键盘F12，进入到如下图的界面：
2、选择【仿真】按钮进入，在文档模式里选择自己想要调用的IE浏览器版本，数字对应I...
InstantClick – 快速响应！让你的网站与众不同
InstantClick 是一个很小的 JavaScript 库，使用了 pushState 和 Ajax 技术，这个组合被称为 Pjax。在访问者点击一个链接之前，鼠标会悬停在链接上面，这两个事件之间通常有200ms~300ms的间隔，InstantClick 利用这个时间间隔预加载页面，这样当你点击页面的时候，其实页面已经加载到本地了，呈现当然也就会很快，大大加速你的网站响应速度。
使用示例：...
18款不同样式的苹果设备响应展示PSD源文件
响应式网站是时下主流，下面提供一些所有苹果设备响应展示分层PSD源文件，可方便展示和推广网页设计师的响应式网站作品。
下载地址：https://www.behance.net/gallery/22663297/Apple-Device-Wireframe-Mockups
下载地址：https://mostpato.deviantart.com/art/Apple-De...
APP应用侧边栏菜单导航jQuery插件Slidebars
Slidebars是一款能快速又简单的实现移动端应用风格菜单显示和侧边栏的jQuery插件，插件非常小巧，压缩后仅有1.69kb大小，提供完整的API、回调功能等，需要jquery 1.8以上版本的库才可以使用。
官方网站：https://www.adchsm.com/slidebars/
Github：https://github.com/adchsm/Slidebars...
优酷视频自适应屏幕的方法
将优酷视频嵌入网站时需要指定长和宽的像素，这对手机等终端十分不友好，可以用javascript让优酷的视频自适应屏幕。
<iframe height=498 width=510 src="http://player.youku.com/embed/XODA2NDM4OTI0" frameborder=0 allowfullscreen></iframe>
以上为一段优酷提供的视频，需要...
支持触摸的jQuery响应式幻灯片插件Owl Carousel
Owl Carousel 是一个强大、实用但小巧的 jQuery 幻灯片插件，兼容包括 IE6、IE7在内的所有浏览器，需要jquery 1.7 及以上版本。Owl Carousel 提供了众多的参数、回调函数及自定义事件，所以它几乎可以满足你的所有要求。它具有一下特点：
兼容所有浏览器
支持响应式
支持 CSS3 过度
支持触摸事件
支持...
通过HTML5 Canvas实现360度全景图
很多购物网站现在都支持360实物全景图像，可以360度任意选择查看样品，这样
对购买者来说是一个很好的消费体验，用HTML5 Canvas也可以实现类似的功能。
360度全景图的原理：
首先需要对实物拍照，间隔是每张照片旋转15度，所以需要23张照片。
照片准备好了以后，尽量选择JPG格式，裁剪到适当大小。
JAVASCRIPT中预加载所有照片，可以配合进度条显...
通过CSS屏蔽iframe中的超链接
原理：在iframe上面覆盖一个DIV，DIV必须有背景色且透明。position为absolute，通过top和left属性控制该DIV的位置使之覆盖于iframe之上。这样iframe就被遮盖住，而里面的任何东西都点不了了。
步骤一：
新建一个文档，命名为A.html，代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transi...
