Aggiungere effetto fade Jquery?

gleenk

Aggiungere effetto fade Jquery?

Ciao ragazzi, dopo svariati esperimenti di niubbaggine sono arrivato a scrivere questo script che funziona in cui cliccando sulla thumbnail mi viene cambiata l'immagine in grande. Quello che ora vorrei fare è che al click il cambio di immagine avvenga con un effetto di fade... ho provato con fadeIn ecc ma non funza (forse xè nn so dove piazzarlo correttamente). Attendo lumi

[html]
$(document).ready(function() {
$('.list a').click(function(){
var link = $(this).attr('href'); //crea una variabile link = all'src su cui ho cliccato
$('.big-img img').attr('src', link );
return false;
});
});
[/html]

fadeIn() funziona su elementi non visibili.
Quindi dovresti prima far scomparire l'immagine, cambiare il link e solo dopo fare il fadeIn().

esempio:

$('.big-img img').fadeOut(function() {
$(this).attr('src', link ).fadeIn();
})

gleenk

Grazie funziona alla grande, fantastico

allampatu

ciao avrei un problema simile. ho installato uno script da flowplayer, una galleria di miniature che al click visualizza l'immagine più grande (non lightbox).

il fade delle foto non mi piace, ho provato a cambiarlo con un fadein ma non funziona nulla

guardando il codice cosa dovrei cambiare?

grazie per l'attenzione

$("#browsable").scrollable().navigator();

$(function() {

$(".scrollable").scrollable();

$(".items img").click(function() {

    // see if same thumb is being clicked
    if ($(this).hasClass("active")) { return; }

    // calclulate large image's URL based on the thumbnail URL (flickr specific)
    var url = $(this).attr("src").replace("_t", "");

    // get handle to element that wraps the image and make it semi-transparent
    var wrap = $("#image_wrap").fadeTo("medium", 0.5);
    
    // the large image from ww.flickr.co
    var img = new Image();


    // call this function after it's loaded
    img.onload = function() {

        // make wrapper fully visible
        wrap.fadeTo("fast", 1);

        // change the image
        wrap.find("img").attr("src", url);

    };

    // begin loading the image from ww.flickr.co
    img.src = url;

    // activate item
    $(".items img").removeClass("active");
    $(this).addClass("active");

// when page loads simulate a "click" on the first image
}).filter(":first").click();
});