单击引导轮播中的下一个或上一个时，图像会跳转

Question

I am working on a site and integrated the bootstrap carousel. Everything is working well, except for a one thing that: When I click on next or previous icon, images will jump a little bit and I feel very annoying about it. I tried every solutions which I have searched and applied but it still didn't work. Can anybody help me with this problem, the url as below: https://test5.extensionesdepelobaratas.net/hair-blog/ You will see the first carousel which have number from 1 to 8. Look forward to hearing solutions from everybody.

Thank you very much.

Answer 1

It looks like there are a handful of elements with the class .item which are not properly being transitioned when it comes to it's attributes and the active class ones which are being applied thereafter.

If you add the following CSS to your .carousel-inner .item elements, all of the values will be transitioned properly.

.carousel-inner .item { transition: all 0.5s ease !important; }

Tested this with the existing website and there is no more 'jumpiness' when it comes to the elements sliding in. Instead, they grow rather than jump to the size which the carousel is setting them as.