Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. Addons
  3. Scroll back to first element of a carousel

Scroll back to first element of a carousel

Scheduled Pinned Locked Moved Addons
13 Posts 3 Posters 487 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • arminunruhA Offline
    arminunruhA Offline
    arminunruh
    Global Moderator
    wrote on last edited by
    #3

    lmk when u release the website its prtty cool i want to add it to laytheme.com

    C 1 Reply Last reply
    0
    • arminunruhA arminunruh

      create a text element that says "go back"

      or sth

      then right click it and "set html class and id" set the class: carouselbutton

      then in lay options → custom head content:

      <script>
      	jQuery(document).on("click", ".carouselbutton", function(e){
      		e.preventDefault();
      		e.stopPropagation();
      		var $carousel = jQuery(".lay-carousel-wrap").first();
      		if( $carousel.length > 0 ) {
      			var mySwiper = $carousel.data('myswiper');
      			// index, speed
      			mySwiper.slideTo(0, 300);
      		}
      	})
      </script>
      

      does it worx?
      havent tried this code, should work i think

      C Offline
      C Offline
      carla
      wrote on last edited by
      #4

      @arminunruh
      Hello Armin
      Thank you very much for your help. It works, but there is still one thing that is not quite round yet. For example, when I am at image 10 and press the button, it goes back to position 0 and does an extra round right away. That wouldn't be too tragic, but it would be great to see the images during that. It would be nice if it looked like you were scrolling back yourself. Can you help me with this?

      1 Reply Last reply
      0
      • arminunruhA arminunruh

        lmk when u release the website its prtty cool i want to add it to laytheme.com

        C Offline
        C Offline
        carla
        wrote on last edited by
        #5

        @arminunruh
        and yes, I'll be sure to let you know. I'm happy, you like the site :-)

        1 Reply Last reply
        0
        • arminunruhA Offline
          arminunruhA Offline
          arminunruh
          Global Moderator
          wrote on last edited by
          #6

          and does an extra round right away.

          what do u mean i dont understand the sentence

          // index, speed
          mySwiper.slideTo(0, 300);

          300 is the speed which it takes to go to the first slide, maybe u can increase it to like 1000

          C 1 Reply Last reply
          0
          • arminunruhA arminunruh

            and does an extra round right away.

            what do u mean i dont understand the sentence

            // index, speed
            mySwiper.slideTo(0, 300);

            300 is the speed which it takes to go to the first slide, maybe u can increase it to like 1000

            C Offline
            C Offline
            carla
            wrote on last edited by
            #7

            @arminunruh

            I've formulated it a bit complicated. Here is a new attempt: At the moment the carousel rotates forward until it is back at 0. The first and the last frames are visible, in between I see the yellow background.

            Is it possible to reverse the direction, so it looks like rewinding / fast scrolling back? And, is it possible that the images in between are also displayed?

            Thanks for your help.

            1 Reply Last reply
            0
            • arminunruhA Offline
              arminunruhA Offline
              arminunruh
              Global Moderator
              wrote on last edited by
              #8

              no sorry not possible :/

              C 2 Replies Last reply
              0
              • arminunruhA arminunruh

                no sorry not possible :/

                C Offline
                C Offline
                carla
                wrote on last edited by
                #9
                This post is deleted!
                1 Reply Last reply
                0
                • arminunruhA arminunruh

                  no sorry not possible :/

                  C Offline
                  C Offline
                  carla
                  wrote on last edited by
                  #10

                  @arminunruh

                  No problem.. A friend was able to help me, now everything works as desired. Thanks anyway for your support. And by the way: The website is now online: www.lucaschenardi.ch

                  One more question: you asked via Instagram a few months ago what could be useful features. I often wished I could "lock" elements / text frames as an administrator, so they can't be moved by the editors.... maybe this is possible in the future :-)

                  Best regards, Carla

                  A 1 Reply Last reply
                  1
                  • arminunruhA Offline
                    arminunruhA Offline
                    arminunruh
                    Global Moderator
                    wrote on last edited by
                    #11

                    thanks

                    ok!
                    very nice website congratz

                    1 Reply Last reply
                    0
                    • C carla

                      @arminunruh

                      No problem.. A friend was able to help me, now everything works as desired. Thanks anyway for your support. And by the way: The website is now online: www.lucaschenardi.ch

                      One more question: you asked via Instagram a few months ago what could be useful features. I often wished I could "lock" elements / text frames as an administrator, so they can't be moved by the editors.... maybe this is possible in the future :-)

                      Best regards, Carla

                      A Offline
                      A Offline
                      Alex F
                      wrote on last edited by
                      #12

                      @carla Hi Carla, your created Website is very inspiring. Thank you for sharing your work. Just one question: how did your friend solve the problem you issued with your button?

                      1 Reply Last reply
                      0
                      • arminunruhA Offline
                        arminunruhA Offline
                        arminunruh
                        Global Moderator
                        wrote on last edited by
                        #13

                        here are all of the swiper methods:

                        https://swiperjs.com/swiper-api

                        you can just look at the code of his website, he used this js

                        <script>
                        	jQuery(document).on("click", ".carouselbutton", function(e){
                        		e.preventDefault();
                        		e.stopPropagation();
                        		var $carousel = jQuery(".lay-carousel-wrap").first();
                        		if( $carousel.length > 0 ) {
                        			var mySwiper = $carousel.data('myswiper');
                        			// index, speed
                        			
                        			var currentIndex = mySwiper.activeIndex - mySwiper.loopedSlides;
                        			
                        			var goToStart = 0;
                        			
                        			if(currentIndex > mySwiper.loopedSlides / 2) {
                            			goToStart = mySwiper.loopedSlides;
                        			}
                        			
                        			mySwiper.slideToLoop(goToStart, 2000, 'easeInOutExpo');
                        
                        
                        		}
                        	});
                        </script>
                        
                        1 Reply Last reply
                        0
                        Reply
                        • Reply as topic
                        Log in to reply
                        • Oldest to Newest
                        • Newest to Oldest
                        • Most Votes


                        I also code custom websites or custom Lay features.
                        šŸ’æ Email me here: šŸ’æ
                        info@laytheme.com

                        Before you post:
                        1. When using a WordPress Cache plugin, disable it or clear your cache.
                        2. Update Lay Theme and all Lay Theme Addons
                        3. Disable all Plugins
                        4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

                        This often solves issues you might run into

                        When you post:
                        1. Post a link to where the problem is
                        2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
                        3. If the problem is difficult to explain, post screenshots / link to a video to explain it
                        Online Users
                        Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
                        laytheme.com
                        • Login

                        • Don't have an account? Register

                        • Login or register to search.
                        • First post
                          Last post
                        0
                        • Recent
                        • Tags
                        • Popular
                        • Users
                        • Search