API tools faq
paste
Guest User

Untitled

a guest
Oct 18th, 2018
120
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
jQuery 8.21 KB | None | 0 0
raw download clone embed print report
  1. var links = ["thumb1","thumb2","thumb3","thumb4","thumb5"];
  2.  
  3. $(document).on("click", ".thumb1", function(){
  4.             if(!$('#thumba1').hasClass("active")) {
  5.                 if(an==0){
  6.                     an=1;
  7.                     prev = 4;
  8.                     next = 1;
  9.                     $('#arrowleft').removeClass().addClass(links[prev]);
  10.                     $('#arrowright').removeClass().addClass(links[next]);      
  11.                     $('#innercontainer2').hide();
  12.                     $('#innercontainer3').hide();
  13.                     $('#innercontainer4').hide();
  14.                     $('#innercontainer5').hide();
  15.                     $('#innercontainer').fadeIn(500);          
  16.                     $('#imgdiv').animate({ backgroundColor: "#25a647" }, 400);
  17.                     $('.rubrikref').animate({color: "#25a647"},400);
  18.                     $('#thumba2').animate({opacity: 0.0}).css('visibility','hidden');
  19.                     $('#thumba3').animate({opacity: 0.0}).css('visibility','hidden');
  20.                     $('#thumba4').animate({opacity: 0.0}).css('visibility','hidden');
  21.                     $('#thumba5').animate({opacity: 0.0}).css('visibility','hidden');
  22.                     $('#thumba1').css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
  23.                     $('#thumba2').animate({opacity: 0.0}).css('visibility','hidden');
  24.                     $('#ref1').css('z-index','1');
  25.                     $('#ref2').css('z-index','1');
  26.                     $('#ref3').css('z-index','1');
  27.                     $('#ref4').css('z-index','1');
  28.                     $('#ref5').css('z-index','1');     
  29.                     $('#ref1').css('z-index','5').fadeIn("500", function(){
  30.                         $('#ref2').css('z-index','1').hide();
  31.                         $('#ref3').css('z-index','1').hide();
  32.                         $('#ref4').css('z-index','1').hide();
  33.                         $('#ref5').css('z-index','1').hide();
  34.                         an=0;
  35.                     });                
  36.                     $('#thumba1').addClass("active");
  37.                     $('#thumba2').removeClass("active");
  38.                     $('#thumba3').removeClass("active");
  39.                     $('#thumba4').removeClass("active");
  40.                     $('#thumba5').removeClass("active");
  41.                 }
  42.             }
  43.         });
  44.        
  45.        
  46.         $(document).on("click", ".thumb2", function(){
  47.             if(!$('#thumba2').hasClass("active")) {
  48.                 if(an==0){
  49.                     an=1;
  50.  
  51.                     prev=0;
  52.                     next=2;
  53.                     $('#arrowleft').removeClass().addClass(links[prev]);
  54.                     $('#arrowright').removeClass().addClass(links[next]);      
  55.                     $('#innercontainer').hide();
  56.                     $('#innercontainer3').hide();
  57.                     $('#innercontainer4').hide();
  58.                     $('#innercontainer5').hide();
  59.                     $('#innercontainer2').fadeIn(500);
  60.                     $('#imgdiv').animate({ backgroundColor: "#ff9800" }, 400);
  61.                     $('.rubrikref').animate({color: "#ff9800"},400);
  62.                     $('#thumba1').animate({opacity: 0.0}).css('visibility','hidden');
  63.                     $('#thumba3').animate({opacity: 0.0}).css('visibility','hidden');
  64.                     $('#thumba4').animate({opacity: 0.0}).css('visibility','hidden');
  65.                     $('#thumba5').animate({opacity: 0.0}).css('visibility','hidden');
  66.                     $('#thumba2').css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
  67.                     $('#ref1').css('z-index','1');
  68.                     $('#ref2').css('z-index','1');
  69.                     $('#ref3').css('z-index','1');
  70.                     $('#ref4').css('z-index','1');
  71.                     $('#ref5').css('z-index','1');
  72.                     $('#ref2').css('z-index','5').fadeIn("500", function(){
  73.                         $('#ref1').css('z-index','1').hide();
  74.                         $('#ref3').css('z-index','1').hide();
  75.                         $('#ref4').css('z-index','1').hide();
  76.                         $('#ref5').css('z-index','1').hide();
  77.                         an=0;
  78.                     });
  79.                     $('#thumba2').addClass("active");
  80.                     $('#thumba1').removeClass("active");
  81.                     $('#thumba3').removeClass("active");
  82.                     $('#thumba4').removeClass("active");
  83.                     $('#thumba5').removeClass("active");
  84.                    
  85.                 }
  86.            
  87.             }
  88.            
  89.         });
  90.        
  91.        
  92.         $(document).on("click", ".thumb3", function(){
  93.             if(!$('#thumba3').hasClass("active")) {
  94.                 if(an==0){
  95.                     an=1;
  96.                     prev=1;
  97.                     next=3;
  98.                     $('#innercontainer').hide();
  99.                     $('#innercontainer2').hide();
  100.                     $('#innercontainer4').hide();
  101.                     $('#innercontainer5').hide();
  102.                     $('#innercontainer3').fadeIn(500);
  103.                     $('#arrowleft').removeClass().addClass(links[prev]);
  104.                     $('#arrowright').removeClass().addClass(links[next]);      
  105.                     $('#imgdiv').animate({ backgroundColor: "#870301" }, 400);
  106.                     $('.rubrikref').animate({color: "#870301"},400);
  107.                     $('#thumba1').animate({opacity: 0.0}).css('visibility','hidden');
  108.                     $('#thumba2').animate({opacity: 0.0}).css('visibility','hidden');
  109.                     $('#thumba4').animate({opacity: 0.0}).css('visibility','hidden');
  110.                     $('#thumba5').animate({opacity: 0.0}).css('visibility','hidden');
  111.                     $('#thumba3').css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0}            
  112.                     $('#ref1').css('z-index','1');
  113.                     $('#ref2').css('z-index','1');
  114.                     $('#ref3').css('z-index','1');
  115.                     $('#ref4').css('z-index','1');
  116.                     $('#ref5').css('z-index','1');
  117.                     $('#ref3').css('z-index','5').fadeIn("500", function(){
  118.                         $('#ref1').css('z-index','1').hide();
  119.                         $('#ref2').css('z-index','1').hide();
  120.                         $('#ref4').css('z-index','1').hide();
  121.                         $('#ref5').css('z-index','1').hide();
  122.                         an=0;
  123.                     });
  124.                     $('#thumba3').addClass("active");
  125.                     $('#thumba1').removeClass("active");
  126.                     $('#thumba2').removeClass("active");
  127.                     $('#thumba4').removeClass("active");
  128.                     $('#thumba5').removeClass("active");
  129.                 }
  130.             }
  131.         });
  132.         $(document).on("click", ".thumb4", function(){
  133.             if(!$('#thumba4').hasClass("active")) {
  134.                 if(an==0){
  135.                     an=1;
  136.                     prev=2;
  137.                     next=4;
  138.                     $('#innercontainer').hide();
  139.                     $('#innercontainer2').hide();
  140.                     $('#innercontainer3').hide();
  141.                     $('#innercontainer5').hide();
  142.                     $('#innercontainer4').fadeIn(500);
  143.                     $('#arrowleft').removeClass().addClass(links[prev]);
  144.                     $('#arrowright').removeClass().addClass(links[next]);      
  145.                     $('#imgdiv').animate({ backgroundColor: "#1a1a1a" }, 400);
  146.                     $('.rubrikref').animate({color: "#1a1a1a"},400);
  147.                     $('#thumba2').animate({opacity: 0.0}).css('visibility','hidden');
  148.                     $('#thumba3').animate({opacity: 0.0}).css('visibility','hidden');
  149.                     $('#thumba5').animate({opacity: 0.0}).css('visibility','hidden');
  150.                     $('#thumba1').animate({opacity: 0.0}).css('visibility','hidden');
  151.                     $('#thumba4').css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
  152.                    
  153.                     $('#ref1').css('z-index','1');
  154.                     $('#ref2').css('z-index','1');
  155.                     $('#ref3').css('z-index','1');
  156.                     $('#ref4').css('z-index','1');
  157.                     $('#ref5').css('z-index','1');
  158.                     $('#ref4').css('z-index','5').fadeIn("500", function(){
  159.                         $('#ref1').css('z-index','1').hide();
  160.                         $('#ref2').css('z-index','1').hide();
  161.                         $('#ref3').css('z-index','1').hide();
  162.                         $('#ref5').css('z-index','1').hide();
  163.                         an=0;
  164.                     });
  165.                     $('#thumba4').addClass("active");
  166.                     $('#thumba1').removeClass("active");
  167.                     $('#thumba2').removeClass("active");
  168.                     $('#thumba3').removeClass("active");
  169.                     $('#thumba5').removeClass("active");
  170.                    
  171.                 }
  172.             }
  173.         });
  174.         $(document).on("click", ".thumb5", function(){     
  175.             if(!$('#thumba5').hasClass("active")) {
  176.                 if(an==0){
  177.                     an=1;
  178.                     prev=3;
  179.                     next=0;
  180.                     $('#innercontainer').hide();
  181.                     $('#innercontainer2').hide();
  182.                     $('#innercontainer3').hide();
  183.                     $('#innercontainer4').hide();
  184.                     $('#innercontainer5').fadeIn(500);
  185.                     $('#arrowleft').removeClass().addClass(links[prev]);
  186.                     $('#arrowright').removeClass().addClass(links[next]);      
  187.                     $('#imgdiv').animate({ backgroundColor: "#2d83d0" }, 400);
  188.                     $('.rubrikref').animate({color: "#2d83d0"},400);
  189.                     $('#thumba2').animate({opacity: 0.0}).css('visibility','hidden');
  190.                     $('#thumba3').animate({opacity: 0.0}).css('visibility','hidden');
  191.                     $('#thumba4').animate({opacity: 0.0}).css('visibility','hidden');
  192.                     $('#thumba1').animate({opacity: 0.0}).css('visibility','hidden');
  193.                     $('#thumba5').css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
  194.                    
  195.                    
  196.                     $('#ref1').css('z-index','1');
  197.                     $('#ref2').css('z-index','1');
  198.                     $('#ref3').css('z-index','1');
  199.                     $('#ref4').css('z-index','1');
  200.                     $('#ref5').css('z-index','1');
  201.                     $('#ref5').css('z-index','5').fadeIn("500", function(){
  202.                         $('#ref1').css('z-index','1').hide();
  203.                         $('#ref2').css('z-index','1').hide();
  204.                         $('#ref3').css('z-index','1').hide();
  205.                         $('#ref4').css('z-index','1').hide();
  206.                         an=0;
  207.                     });
  208.                     $('#thumba5').addClass("active");
  209.                     $('#thumba1').removeClass("active");
  210.                     $('#thumba2').removeClass("active");
  211.                     $('#thumba3').removeClass("active");
  212.                     $('#thumba4').removeClass("active");
  213.                 }
  214.             }
  215.         });
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!