Gmor

Untitled

May 28th, 2014
205
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*
  2. * jQuery Slider Plugin
  3. * Version : Am2_SimpleSlider.js
  4. * author  :amit & amar
  5. * website :
  6. * Date    :06-2-2014
  7.  
  8. * NOTE : "jQuery v1.8.2 used while developing"
  9. */
  10.  
  11. (function ($) {
  12.  
  13.     jQuery.fn.Am2_SimpleSlider = function () {
  14.         //popup div
  15.         $div = $('<div class="product-gallery-popup"> <div class="popup-overlay"></div> <div class="product-popup-content"> <div class="product-image"> <img id="gallery-img" src="" alt="" /> <div class="gallery-nav-btns"> <a id="nav-btn-next" class="nav-btn next" ></a> <a id="nav-btn-prev" class="nav-btn prev" ></a></div> </div><div class="product-information"> <p class="product-desc"></p></div> <div class="clear"></div><a href="#" class="cross">X</a></div></div>').appendTo('body');
  16.  
  17.         //on image click  
  18.         $(this).click(function () {
  19.             $('.product-gallery-popup').fadeIn(500);
  20.             $('body').css({ 'overflow': 'hidden' });
  21.             $('.product-popup-content .product-image img').attr('src', $(this).find('img').attr('src'));
  22.             $('.product-popup-content .product-information p').text($(this).find('div').attr('data-desc'));
  23.             $Current = $(this);
  24.             $PreviousElm = $(this).prev();
  25.             $nextElm = $(this).next();
  26.             if ($PreviousElm.length === 0) { $('.nav-btn.prev').css({ 'display': 'none' }); }
  27.             else { $('.nav-btn.prev').css({ 'display': 'block' }); }
  28.             if ($nextElm.length === 0) { $('.nav-btn.next').css({ 'display': 'none' }); }
  29.             else { $('.nav-btn.next').css({ 'display': 'block' }); }
  30.         });
  31.         //on Next click
  32.         $('.next').click(function () {
  33.             $NewCurrent = $nextElm;
  34.             $PreviousElm = $NewCurrent.prev();
  35.             $nextElm = $NewCurrent.next();
  36.             $('.product-popup-content .product-image img').clearQueue().animate({ opacity: '0' }, 0).attr('src', $NewCurrent.find('img').attr('src')).animate({ opacity: '1' }, 500);
  37.          
  38.          
  39.            
  40.             $('.product-popup-content .product-information p').text($NewCurrent.find('div').attr('data-desc'));
  41.             if ($PreviousElm.length === 0) { $('.nav-btn.prev').css({ 'display': 'none' }); }
  42.             else { $('.nav-btn.prev').css({ 'display': 'block' }); }
  43.             if ($nextElm.length === 0) { $('.nav-btn.next').css({ 'display': 'none' }); }
  44.             else { $('.nav-btn.next').css({ 'display': 'block' }); }
  45.         });
  46.         //on Prev click
  47.         $('.prev').click(function () {
  48.             $NewCurrent = $PreviousElm;
  49.             $PreviousElm = $NewCurrent.prev();
  50.             $nextElm = $NewCurrent.next();
  51.             $('.product-popup-content .product-image img').clearQueue().animate({ opacity: '0' }, 0).attr('src', $NewCurrent.find('img').attr('src')).animate({ opacity: '1' }, 500);
  52.            
  53.             $('.product-popup-content .product-information p').text($NewCurrent.find('div').attr('data-desc'));
  54.             if ($PreviousElm.length === 0) { $('.nav-btn.prev').css({ 'display': 'none' }); }
  55.             else { $('.nav-btn.prev').css({ 'display': 'block' }); }
  56.             if ($nextElm.length === 0) { $('.nav-btn.next').css({ 'display': 'none' }); }
  57.             else { $('.nav-btn.next').css({ 'display': 'block' }); }
  58.         });
  59.         //Close Popup
  60.         $('.cross,.popup-overlay').click(function () {
  61.             $('.product-gallery-popup').fadeOut(500);
  62.             $('body').css({ 'overflow': 'initial' });
  63.         });
  64.  
  65.         //Key Events
  66.         $(document).on('keyup', function (e) {
  67.             e.preventDefault();
  68.             //Close popup on esc
  69.             if (e.keyCode === 27) { $('.product-gallery-popup').fadeOut(500); $('body').css({ 'overflow': 'initial' }); }
  70.             //Next Img On Right Arrow Click
  71.             if (e.keyCode === 39) { NextProduct(); }
  72.             //Prev Img on Left Arrow Click
  73.             if (e.keyCode === 37) { PrevProduct(); }
  74.         });
  75.  
  76.         function NextProduct() {
  77.             if ($nextElm.length === 1) {
  78.                 $NewCurrent = $nextElm;
  79.                 $PreviousElm = $NewCurrent.prev();
  80.                 $nextElm = $NewCurrent.next();
  81.                 $('.product-popup-content .product-image img').clearQueue().animate({ opacity: '0' }, 0).attr('src', $NewCurrent.find('img').attr('src')).animate({ opacity: '1' }, 500);
  82.                
  83.                 $('.product-popup-content .product-information p').text($NewCurrent.find('div').attr('data-desc'));
  84.                 if ($PreviousElm.length === 0) { $('.nav-btn.prev').css({ 'display': 'none' }); }
  85.                 else { $('.nav-btn.prev').css({ 'display': 'block' }); }
  86.                 if ($nextElm.length === 0) { $('.nav-btn.next').css({ 'display': 'none' }); }
  87.                 else { $('.nav-btn.next').css({ 'display': 'block' }); }
  88.             }
  89.  
  90.         }
  91.  
  92.         function PrevProduct() {
  93.             if ($PreviousElm.length === 1) {
  94.                 $NewCurrent = $PreviousElm;
  95.                 $PreviousElm = $NewCurrent.prev();
  96.                 $nextElm = $NewCurrent.next();
  97.                 $('.product-popup-content .product-image img').clearQueue().animate({ opacity: '0' }, 0).attr('src', $NewCurrent.find('img').attr('src')).animate({ opacity: '1' }, 500);
  98.        
  99.                 $('.product-popup-content .product-information p').text($NewCurrent.find('div').attr('data-desc'));
  100.                 if ($PreviousElm.length === 0) { $('.nav-btn.prev').css({ 'display': 'none' }); }
  101.                 else { $('.nav-btn.prev').css({ 'display': 'block' }); }
  102.                 if ($nextElm.length === 0) { $('.nav-btn.next').css({ 'display': 'none' }); }
  103.                 else { $('.nav-btn.next').css({ 'display': 'block' }); }
  104.             }
  105.  
  106.         }
  107.     };
  108.  
  109. } (jQuery));
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×