Aspire
Koineks
  • 25-12-2016, 02:51:36
    #1
    1/2
    Merhaba arkadaşlar, aşağıdaki şekilde bir css yapım var. Bunu alttaki küçük görsellere tıklandığında üstte büyük hali açılması işlemini jq ile nasıl yapabilrim ?



    Google de tam olarak ne yazıp aratacağımı bilemediğim için buradan sormak istedim.
    >> Satılık E-ticaret ve Fotografçılık Domainleri
  • Sponsor Reklam
  • 27-12-2016, 03:11:42
    #2
    1/2
    Merhaba,

    html yapınızı bilmediğim için yine her zamanki gibi atmasyon bir yanıt vermeye çalışacağım.

    alttaki resimleriniz <ul class="tiklanacakufaklar"><li><img src=""></li> şeklinde olduğunu varsayalım.
    üstteki büyük resmin de
    <img src="xxx" class="buyukresim"> gibi bi şey olduğunu varsayalım.

    alttaki ufak resimlerin thumbnail mı yukarıdaki büyük resim boyutundan rescale edilmiş hali mi bilemiyoruz. haliyle atarak onu da scale edilmiş orjinal varsayalım.

    $(function(){
    $(".tiklanacakufaklar li").click(function(){
    $(".buyukresim").attr("src",$(this).attr("src")) ;
    });
    });

    Eğer küçük resimler thumbnail ise o zaman üstteki resmin kaynağını değiştirmek için büyük ismi bi şekilde edinmemiz gerek.

    O datayı li içindeki img 'ye bir data-attribute olarak eklerseniz erişiminiz kolay olacaktır.
    <ul class="tiklanacakufaklar"><li><img src="urun-resmi-kucuk.jpg" data-original="urun-resmi-orjinalx.jpg"></li>

    gibi olduğunu varsayarsak;
    $(".tiklanacakufaklar li").click(function(){
    $(".buyukresim").attr("src",$(this).attr("data-original"));
    });

    gibi...

    Soru çok genel haliyle çokca yanıtı var fakat anlaşılır olması için böyle kolay bi "atış senaryosu" kullandım


    umarım az da olsa fikir vermiştir.

    kolaylıklar.
    yanıtımla problemi çözülüp teşekküre basmayanları kaydettiğim bir not defterim var ;)