Fading Slider only transitions first slide properly

  • Resolved Jo Batkin

    (@jobatkin)


    10 years, 1 month ago

    I have been using the Snippet to change the slider to a fader for my website, but it only seems to fade out the first slide. The next one jumps straight in with no nice fading transition.

    I’ve tried to isolate the code into a demo to demonstrate what I mean which you can see here.

    The recommended code:
    .carousel-inner > .item { -webkit-transition: opacity 2s ease-in-out; transition: opacity 2s ease-in-out ; }

    seems to be only applying to the first slide for some reason. I’ve tried several variations on it with no luck. Would appreciate some help, thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • rdellconsulting

    (@rdellconsulting)

    10 years, 1 month ago

    In this code (#59):

    .carousel-inner > .item {
  line-height: 433px;
  min-height: 433px;
  top: 0;
  width: 100%;
}

    I knocked out the position:relative and it seems to work?

    Thread Starter Jo Batkin

    (@jobatkin)

    10 years, 1 month ago

    Wow, you’re a wonder. Something that simple! Thank you so much. It is working perfectly 😀

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Fading Slider only transitions first slide properly’ is closed to new replies.