这几年关于图片版权索赔的事件不在少数，要避免图片侵权，最简单的办法就是直接从正版图库购买版权图片，对于初创公司而言成本太高。这里给大家整理了10个目前提供免费图片素材资源网站，这些网站的图片质量相当高，大部分为高分辨率，最重要的是，它是免费的，无版权限制哦！ Pixabay 网址：https://pixabay.com/ Pixabay提供可在任何地方使用的免费图片和视频，所有的图像和视频Pixabay释放自由版权下创作共用CC0。你可以下载、修改、分发，并使用它们在任何你喜欢的任何东西，超过 900000 高质量照片、 插图和矢量图形。可免费用于商...
HTML5 canvas可以读取图片信息，绘制当前图片。于是可以实现图片马赛克，模糊，色值过滤等很多图片特效。我们这里不用那么复杂，只要读取我们的图片，重绘下就可以。 HTML代码： <img id="testImg" src="xxx.gif" width="224" height="126"> <p><input type="button" id="testBtn" value="停止"></p> JS代码： if ('getContext' in document.createEl...
到需要可以随时随地停止gif动态图片播放的需求的时候，可以通过下面几种方法实现。 方法一：多img资源控制处理 就是准备2套图片，一个是gif动态图片，还有一个是只有一帧的静止的图片，如jpg图片。然后使用JS来回切换<img>的src值为这两张图片地址，或者通过js实现点击就切换显示两张图片。 这种方法的优点就是兼容性强，所有浏览器都可以实现停止效果。然而这种方法有个局限，就是暂停时候呈现的图片永远是同一张。基本上可以说是停止，而不是暂停。 代码如下： html <div class="inpic"&g...
现在的操作系统使用的IE浏览器版本都比较高，有时候制作网页的时候需要测试低版本IE浏览器的兼容问题会显得比较麻烦，部分人会使用IEtest软件测试，但该软件体验发现并不好，其实上IE11浏览器本身就提供了IE7、IE8、IE9、IE10浏览器的测试功能。 1、打开IE浏览器，点击键盘F12，进入到如下图的界面： 2、选择【仿真】按钮进入，在文档模式里选择自己想要调用的IE浏览器版本，数字对应IE的版本： 3、选择版本后，就可以输入网站调试了。
InstantClick 是一个很小的 JavaScript 库，使用了 pushState 和 Ajax 技术，这个组合被称为 Pjax。在访问者点击一个链接之前，鼠标会悬停在链接上面，这两个事件之间通常有200ms~300ms的间隔，InstantClick 利用这个时间间隔预加载页面，这样当你点击页面的时候，其实页面已经加载到本地了，呈现当然也就会很快，大大加速你的网站响应速度。 使用示例： ... <script src="instantclick.min.js" data-no-instant></script> &...
响应式网站是时下主流，下面提供一些所有苹果设备响应展示分层PSD源文件，可方便展示和推广网页设计师的响应式网站作品。 下载地址：https://www.behance.net/gallery/22663297/Apple-Device-Wireframe-Mockups 下载地址：https://mostpato.deviantart.com/art/Apple-Devices-flat-Icon-Free-512702025 下载地址：https://www.pixeden.com/psd-we...
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> 以上为一段优酷提供的视频，需要指定长和宽，其实，我们可以用javascript获取屏幕的宽度，再乘以相应的比率，从而让视频自适应屏幕大小。 先给iframe制定一个id...
Owl Carousel 是一个强大、实用但小巧的 jQuery 幻灯片插件，兼容包括 IE6、IE7在内的所有浏览器，需要jquery 1.7 及以上版本。Owl Carousel 提供了众多的参数、回调函数及自定义事件，所以它几乎可以满足你的所有要求。它具有一下特点： 兼容所有浏览器 支持响应式 支持 CSS3 过度 支持触摸事件 支持 JSON 及自定义 JSON 格式 支持进度条 支持自定义事件 支持延迟加载 支持自适...
很多购物网站现在都支持360实物全景图像，可以360度任意选择查看样品，这样 对购买者来说是一个很好的消费体验，用HTML5 Canvas也可以实现类似的功能。 360度全景图的原理： 首先需要对实物拍照，间隔是每张照片旋转15度，所以需要23张照片。 照片准备好了以后，尽量选择JPG格式，裁剪到适当大小。 JAVASCRIPT中预加载所有照片，可以配合进度条显示加载精度 创建/获取Canvas对象，加上鼠标监听事件，当鼠标左右移动时候，适度的绘制不 同帧。大致的原理就是这样，比较简...
原理：在iframe上面覆盖一个DIV，DIV必须有背景色且透明。position为absolute，通过top和left属性控制该DIV的位置使之覆盖于iframe之上。这样iframe就被遮盖住，而里面的任何东西都点不了了。 步骤一： 新建一个文档，命名为A.html，代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ht...
JavaScript是运行在客户端的脚本，因此一般是不能够设置Session的，因为Session是运行在服务器端的。 而cookie是运行在客户端的，所以可以用JS来设置cookie. 假设有这样一种情况，在某个用例流程中，由A页面跳至B页面，若在A页面中采用JS用变量temp保存了某一变量的值，在B页面的时候，同样需要使用JS来引用temp的变量值，对于JS中的全局变量或者静态变量的生命周期是有限的，当发生页面跳转或者页面关闭的时候，这些变量的值会重新载入，即没有达到保存的效果。解决这个问题的最好的方案是采用cookie来保存该变量的值，那么如何来设置和读取c...