To insert code use <code>...</code>.
Gray scale image effect for a gallery?
  • Is it possible the grayscale image effect to apply for a gallery?
    So that the preview images are displayed with this effect?
  • 2 Comments sorted by
  • Hi i ad a comment i would invert the gray scale on thumbnails.
    Have the grayscale who's hide on rollover
  • Hi,
    You can invert like that just change mouOut and mouseOver line.
    Take & Paste it in the Custom.js in JS FOLDER.


    var enable_image_grayscale_hover = function(image){
    $(this).stop().animate({opacity:0}, grayscale_outSpeed);


    // clone image
    $('img', image).each(function(){
    var el = $(this);
    el.css({"position":"absolute"}).wrap("
    ").clone().addClass('img_grayscale').css({"position":"absolute","z-index":"100","opacity":"0"}).insertBefore(el).queue(function(){
    var el = $(this);
    el.parent().css({"width":this.width,"height":this.height});
    el.dequeue();
    });
    this.src = grayscale(this.src);
    });
    if(typeof grayscale_animSpeed=='undefined'){
    grayscale_animSpeed = 1000;
    }
    if(typeof grayscale_outSpeed=='undefined'){
    grayscale_outSpeed = 1000;
    }
    // Fade image
    $('img', image).mouseover(function(){
    $(this).parent().find('img:first').stop().animate({opacity:1}, grayscale_animSpeed);
    })
    $('img', image).mouseout(function(){
    $('img', image).fadeIn(500);

    });
    };