Convert color image to black and white image using jQuery

In this post, Convert color image to black and white or greyscale images using a jQuery Plugin called "jQuery BlackAndWhite". jQuery BlackAndWhite plug-in can easily convert any colored image into a Black and White grey-scale image. It uses the the HTML5 canvas tag and a fallback for the old browsers.

How to use it?

  • Download and include jQuery BlackAndWhite Plugin library reference along with jQuery.
  • Set the image wrappers using the css.
    .bwWrapper {
        position:relative;
        display:block;
    }
    
  • Initialize the plug in on window load (no $(document).ready()):
$(window).load(function(){
    $('.bwWrapper').BlackAndWhite({
        hoverEffect : true, 
        webworkerPath : false,
        responsive:true,
        invertHoverEffect: false,
        speed: { 
            fadeIn: 200, 
            fadeOut: 800
        }
    });
});
Official Website

Feel free to contact me for any help related to jQuery, I will gladly help you.



Responsive Menu
Add more content here...