Jump to content

WTCOC

Member
  • Posts

    4
  • Joined

  • Last visited

Posts posted by WTCOC

  1. @benf @socialxdata @barney

    This code is working.

    
    
    <script>
       Y.on('domready', function () {
           var galleries = Y.Squarespace.GalleryManager.getGalleries();
           var duration = 4000;
           var gallery=galleries[0];
           var carousel=gallery["gallery-design"];
           var totalGroups=carousel.get('totalGroups');
           var currentGroup=0
           var container=gallery.get("container");
           var nextBtn=Y.one(gallery.get("elements.next")._nodes[0]).on("click",function(e){
               e.preventDefault();
               e.stopPropagation();
               advanceCarousel()
           })
           var prevBtn=Y.one(gallery.get("elements.previous")._nodes[0]).on("click",function(e){
               e.preventDefault();
               e.stopPropagation();
               backupCarousel()
           })
           Y.one(container._node).get('parentNode').on("mouseover",function(){
               clearInterval(myInterval)
           })
           Y.one(container._node).get('parentNode').on("mouseout",function(){
               clearInterval(myInterval)
               setMyInterval()
           })
           var myInterval;
           function setMyInterval(){
               myInterval = setInterval(function(){
                   advanceCarousel()
               },duration)
           }
           setMyInterval();
           function advanceCarousel(){
               if(currentGroup==(totalGroups-1)){
                   currentGroup=0;
               }else{
                   currentGroup++;
               }   
               carousel.goToGroup(currentGroup);
           }
           function backupCarousel(){
               if(currentGroup==0){
                   currentGroup=totalGroups-1
               }else{
                   currentGroup--;
               }
               carousel.goToGroup(currentGroup);
           }
       });
    </script>
    
    
    

  2. In response to Paul2009, here's the new code.

    
    
    <script>
       Y.on('domready', function () {
           var galleries = Y.Squarespace.GalleryManager.getGalleries();
           var duration = 4000;
           var gallery=galleries[0];
           var carousel=gallery["gallery-design"];
           var totalGroups=5;
           var currentGroup=0
           var container=gallery.get("container");
           var nextBtn=Y.one(gallery.get("elements.next")._nodes[0]).on("click",function(e){
               e.preventDefault();
               e.stopPropagation();
               advanceCarousel()
           })
           var prevBtn=Y.one(gallery.get("elements.previous")._nodes[0]).on("click",function(e){
               e.preventDefault();
               e.stopPropagation();
               backupCarousel()
           })
           Y.one(container._node).get('parentNode').on("mouseover",function(){
               clearInterval(myInterval)
           })
           Y.one(container._node).get('parentNode').on("mouseout",function(){
               clearInterval(myInterval)
               setMyInterval()
           })
           var myInterval;
           function setMyInterval(){
               myInterval = setInterval(function(){
                   advanceCarousel()
               },duration)
           }
           setMyInterval();
           function advanceCarousel(){
               if(currentGroup==(totalGroups-1)){
                   currentGroup=0;
               }else{
                   currentGroup++;
               }   
               carousel.goToGroup(currentGroup);
           }
           function backupCarousel(){
               if(currentGroup==0){
                   currentGroup=totalGroups-1
               }else{
                   currentGroup--;
               }
               carousel.goToGroup(currentGroup);
           }
       });
    </script>
    
    

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.