• Címkék:
  • kép
  • image
  • hover
  • egér
  • mutató

Adipoli

1. példa

jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu

Deklaráció

        $(document).ready(function(){
          $('.pelda-1').adipoli({
            startEffect: 'transparent',
            hoverEffect: 'boxRandom'
          });
        });
      

HTML kód

        <img class="pelda-1" src="images/img1.jpg" width="300" height="225" alt="" />
        <img class="pelda-1" src="images/img2.jpg" width="300" height="225" alt="" />
        <img class="pelda-1" src="images/img3.jpg" width="300" height="225" alt="" />
      

2. példa

jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu

Deklaráció

        $(document).ready(function(){
          $('.pelda-2').adipoli({
            startEffect: 'overlay',
            hoverEffect: 'popout'
          });
        });
      

HTML kód

        <img class="pelda-2" src="images/img4.jpg" width="300" height="225" alt="" />
        <img class="pelda-2" src="images/img5.jpg" width="300" height="225" alt="" />
        <img class="pelda-2" src="images/img6.jpg" width="300" height="225" alt="" />
      

3. példa

jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu

Deklaráció

        $(document).ready(function(){
          $('.pelda-3').adipoli({
            startEffect: 'grayscale',
            hoverEffect: 'normal'
          });
        });
      

HTML kód

        <img class="pelda-3" src="images/img7.jpg" width="300" height="225" alt="" />
        <img class="pelda-3" src="images/img8.jpg" width="300" height="225" alt="" />
        <img class="pelda-3" src="images/img9.jpg" width="300" height="225" alt="" />
      

4. példa

jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu jQuery plugins - www.jquery-plugins.hu

Deklaráció

        $(document).ready(function(){
          $('.pelda-4').adipoli({
            startEffect: 'transparent',
            hoverEffect: 'boxRainGrowReverse'
          });
        });
      

HTML kód

        <img class="pelda-4" src="images/img10.jpg" width="300" height="225" alt="" />
        <img class="pelda-4" src="images/img11.jpg" width="300" height="225" alt="" />
        <img class="pelda-4" src="images/img12.jpg" width="300" height="225" alt="" />
      

« bezár