jQuery图片黑白开关插件BlackAndWhite
来源:互联网 发布:用nginx搭建web服务器 编辑:程序博客网 时间:2024/06/02 22:39
演 示 下 载
BlackAndWhite 是一款图片类的插件,这款插件可以很容易地将任何彩色图片转换成B&W灰度图片,当鼠标移动到图片上时,图片可慢慢恢复原有的色彩。该插件可用于图片展示或相册等。
使用方法
引入文件
<script src="js/jquery-1.9.0.min.js"></script><script src="js/jQuery.BlackAndWhite.js"></script>
HTML
<ul id="wrapper"> <li> <a class="bwWrapper" href="###"> <img src="images/Chrysanthemum.jpg" alt=""> </a> </li> <li> <a class="bwWrapper" href="###"> <img src="images/Desert.jpg" alt=""> </a> </li> <li> <a class="bwWrapper" href="###"> <img src="images/Koala.jpg" alt=""> </a> </li> <li> <a class="bwWrapper" href="###"> <img src="images/Lighthouse.jpg" alt=""> </a> </li> <li> <a class="bwWrapper" href="###"> <img src="images/Penguins.jpg" alt=""> </a> </li> <li> <a class="bwWrapper" href="###"> <img src="images/Tulips.jpg" alt=""> </a> </li></ul>
注意,有一个类名 class=”bwWrapper”,这个必须有,因为下面的 CSS 需要用到。当然改成别的也可以,但必须与 CSS 样式对应。
CSS
.bwWrapper { position: relative; display: block;}
JavaScript
$(window).load(function(){ $('.bwWrapper').BlackAndWhite({ hoverEffect:true, webworkerPath: 'js/' });});
注意:BlackAndWhite 必须使用 window load 事件,而不是 $(document).ready() 事件,因为 BlackAndWhite 是应用于图片上,所以必须等图片加载完成。
参数
演 示 下 载
标签:jQuery插件
http://www.dowebok.com/8.html
0 0
- jQuery图片黑白开关插件BlackAndWhite
- JQUERY图片放大镜插件
- Jquery 图片浏览插件
- jquery 图片放大镜插件
- jquery 图片滚动插件
- JQUERY剪裁图片插件
- jQuery图片裁剪插件
- jQuery图片放大镜插件
- JQuery插件:图片放大镜
- Bootstrup的炫酷jQuery开关按钮插件
- 基于Bootstrap的超酷jQuery开关按钮插件
- jQuery-黑白反斗棋
- JQuery实现开关灯及图片的显示,背景变暗
- 图片变成黑白
- GDI+ 图片黑白处理
- 将图片变成黑白
- IOS 图片转成黑白
- 图片变黑白
- 线程同步-互斥量
- 【Oracle篇】游标的原理和使用
- 九种常用排序的性能分析总结
- HDU 5024
- 递归打印输出一个整数的所有因式分解
- jQuery图片黑白开关插件BlackAndWhite
- 设计模式——代理模式
- Android后退按钮的事件处理
- 插入排序
- cdecl、stdcall,pascal三种动态库的区别
- 搭建maya2015 API C++ plugin开发环境
- 海尔集团社区目录迁移实际开发运用
- jQuery滚动到顶部插件scrollUp
- 【Oracle篇】六月笔记集合