Topic: Multi Item Carousel Advance - 1 item per time weird effect

Upside30 free asked 4 years ago


Expected behavior

For the animation to be smooth without issuehttps://mdbootstrap.com/docs/jquery/javascript/carousel/

Actual behavior

It distorts and blurs all of my text and images for some reasonhttps://gyazo.com/146ed2eb0fda81b8cbbea3b015033678

Resources (screenshots, code snippets etc.)

JS - // Material Select Initialization $(document).ready(function () { $('.mdb-select').material_select(); $('.carousel.carousel-multi-item.v-2 .carousel-item').each(function () { var next = $(this).next(); if (!next.length) { next = $(this).siblings(':first'); } next.children(':first-child').clone().appendTo($(this));

            for (var i = 0; i < 3; i++) {
                next = next.next();
                if (!next.length) {
                    next = $(this).siblings(':first');
                }
                next.children(':first-child').clone().appendTo($(this));

            }
        });

    });

Mateusz Łubianka staff commented 4 years ago

@Upside30,

Do you have this issue only in your project/specific browser? I checked it and on MDB site it works good.

Best,


Upside30 free commented 4 years ago

It seems the blur appears on all browsers I’m deploying my project too. The one on the mdbootstrap site works correctly without blur however my project causes the carousel to blur as in the gyazo video


Mateusz Łubianka staff commented 4 years ago

Hi,

please, create a snippet showing your problem here: https://mdbootstrap.com/snippets/. I'll try to help you.

Best,



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Opened

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.11.0
  • Device: web
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes