Jump to content


Photo
- - - - -

Carousel "jumps"

carousel shortcode

Best Answer jane , 04 September 2013 - 11:39 AM

 

Hi there,

 

Try using the following css to see if this prevents the jump when the slide moves in/out of the frame.

 

.carousel-inner {
    height300px;
}

 

This did the trick, thank you James. Although I changed the height to 400 px  otherwise the captions were cut off.

 

Thanks again.

Go to the full post


  • Please log in to reply
10 replies to this topic

#1 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 13 August 2013 - 01:41 PM

Hello,

I am using the carousel shortcode here:


I've found though, that as the slides transition, it "jumps". I've turned off all plugins to see if it's a conflict the the issue remains the same.

Is there a fix for this?

Thanks



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 13 August 2013 - 03:01 PM

Hi,

Which carousel are you using?



#3 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 13 August 2013 - 03:03 PM

The shortcode available here:

Please Login or Register to see this Hidden Content

 

  1. [pl_carousel name="PageLinesCarousel"][pl_carouselimage first="yes" title="Slide 1" imageurl="" ]
  2. Here is the first slide and it's caption.
  3. [/pl_carouselimage]
  4.  
  5. [pl_carouselimage title="Slide 2" imageurl=""]
  6. Here is the second slide, in all its glory.
  7. [/pl_carouselimage]
  8.  
  9. [pl_carouselimage title="Slide 3" imageurl=""]
  10. You can have as many slides as you can create.
  11. [/pl_carouselimage]
  12. [/pl_carousel]


#4 Martin Davies

Martin Davies

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 28 August 2013 - 07:41 PM

Hello Jane - did you manage to resolve this? Are all your images the same size? 



#5 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 29 August 2013 - 01:52 PM

Hi Martin, 

 

No, I haven't found a fix for it so I'm using tabs instead...

 

To answer your question, all the slides were the same size.



#6 Danny

Danny

    Is Awesome!

  • Moderators
  • 15084 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 29 August 2013 - 01:55 PM

I can't actually see where you have the Carousel shortcode on that page. However, your issue is most likely caused by Wordpress having the habit of adding <p> tags whenever you do a linebreak.

 

To resolve your issue, you can either remove all linebreaks from your shortcode so it appears as one long shortcode (on one line) or use the [pl_raw] shortcode and wrap it around your Carousel shortcode.

 

For example:

 

[pl_raw]

[Carousel Shortcode]

[/pl_raw]

 

The PL RAW simply stops Wordpress from adding line breaks. However, it can only be used once per page.



#7 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 29 August 2013 - 02:21 PM

Hi Danny,

 

Thanks for the quick reply.

 

I've followed both of your suggestions and the problem still remains:

 

 

Is this problem fixable?



#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 15084 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 29 August 2013 - 02:35 PM

Can you add your code to your post so I can test it on my end please.



#9 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 29 August 2013 - 02:41 PM

Hi Danny,
 
For sure - here it is:



#10 James B

James B

    Advocate

  • Moderators
  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 04 September 2013 - 12:41 AM

Hi there,

 

Try using the following css to see if this prevents the jump when the slide moves in/out of the frame.

 

.carousel-inner {
    height300px;
}


#11 jane

jane

    Advocate

  • Members
  • 345 posts
  • Country: Country Flag

Posted 04 September 2013 - 11:39 AM   Best Answer

 

Hi there,

 

Try using the following css to see if this prevents the jump when the slide moves in/out of the frame.

 

.carousel-inner {
    height300px;
}

 

This did the trick, thank you James. Although I changed the height to 400 px  otherwise the captions were cut off.

 

Thanks again.







Also tagged with one or more of these keywords: carousel, shortcode