fraction

Mario Jäckle tarafından geliştirilmiş olan FractionSlider  eklentisi site görünümüne   önem veren kişiler  için kullanılabilecek eşsiz  örneklerden biri  sanırım. Henüz  yeni  yapılmış olmasına rağmen bir çok  kişi  tarafından ilgi  görmeyi  başarmış ve sanırım bu animasyonlar ile  daha da  yayılacak  gibi görünüyor.

Çoklu  animasyon denilince  akla birden fazla animasyon örneği gelir  elbette ama  bu  eklentideki çoklu  sözü  aynı  anda  birden fazla  nesneye  farklı  şekillerde slide geçişler  verebilme özelliğinden bahsediyor.  Slaytlar  tek bir resmin kayıp  yada fade  efekti ile solup yerine başka  bir  resmin gelmesi gibi  alışıldık  örneklerden değil. Aynı  anda  birden fazla  resim  her  biri  belirli bir  bölgeye  doğru kayarak slayt işlemini gerçekleştiriyorlar.

Eklenti  ile  dilediğiniz  kadar  farklı  farklı  slide geçişler  uyguladığınız  gibi  dilediğiniz  kadar farklı  nesnelerede  geçişler  uygulayabiliyorsunuz.  İlk  açılışta  resimler  yerlerine  oturduktan sonra  ardından tıklanılabilir başlıklar  sırasıyla  ya  sağdan yada  soldan kendileri  için ayarlanmış olan bölümlere  doğru  yaklaşıyorlar. Demo örneğinde  yok  ama  bir  nesneyede  video  eklenmiş olsaydı sanırım daha  çekici olurdu. O kısmıda  artık dilerseniz kendiniz  yaparsınız.

 

Diğer Demolar

 


Etiketler:
Mintik senin düşüncelerini merak ediyor.Bir yorum yaz

  1. Ghaleon dedi ki:

    Hi !!
    I’m trying to use your amazing slider, but I’m having some problem, it doesnt want to work…

    I followed this: http://jacksbox.de/stuff/jquery-fractionslider/documentation/

    Where should I put the

    jQuery(window).load(function(){
    $(‘.slider’).fractionSlider();
    }); ?

    I followed exactly what is in that link.

    called the .CSS, Jquery, and fractionslider.js. Added the html that is in that link, but nothing happens ;s

    Thank you sir!

  2. rossi46 dedi ki:

    ?m using this. But in element ??, I can?t set with or element inside it. I use many other element ?div? contain image, h1, h2, span? in ?, but when I set width of div and width of image, it isn?t affect. I don?t know why.

    Here is my code:

    <a href='' title='' rel="nofollow">ff</a>
    <a href='/tai-lieu/sach-hoc-tieng-anh-toan-tap-tieng-viet-m1-cd10-cm0.aspx' title='' rel="nofollow">ff</a>
     L??t xem: 0Download: 0
     hhhd
    • Mintik dedi ki:

      Try like that :

      <div class="slider"><!-- your slider container -->
       <div class="slide"><!-- all elements for the first slide --></div>
       <div class="slide"><!-- all elements for the second slide --></div>
       <!-- and so on -->
       <div class="fs_loader"><!-- shows a loading .gif while the slider is getting ready --></div>
       </div>

      You can add your div or other elements like image and style class. Or here examine plugin documentation.