Сова Карусель в Magento 2 не работает правильно - PullRequest
Новая
       48

Сова Карусель в Magento 2 не работает правильно

0 голосов
/ 25 сентября 2019

Карусель сов в Magento 2 не работает для меня корректно.

Я могу перемещать ее влево и вправо, но изображения располагаются ниже друг друга, а не рядом друг с другом, как карусель.

Кто-нибудь знает решение?(изображение ниже выглядит так).

enter image description here

Это то, что я сделал, чтобы добавить Owl Carousel:

requirejs-config.js в Magento_Catalog

owl.carousel.css в Magento_Catalog / web / css

owl.carousel.js в Magento_Catalog / web / js

И следующее в моем шаблонефайл: 

<link rel="stylesheet" type="text/css" href="<?php echo $block->getViewFileUrl('Magento_Catalog::css/owl.carousel.css')?>">

<div id="owlslider" class="">
    <ul>
        <li><img src="https://images.pexels.com/photos/67636/rose-blue-flower-rose-blooms-67636.jpeg"></li>
        <li><img src="https://images.pexels.com/photos/67636/rose-blue-flower-rose-blooms-67636.jpeg"></li>
    </ul>
</div>
<script>
    (function  () {
        require(["jquery","owlcarousel"],function($) {
            $(document).ready(function() {
                $("#owlslider").owlCarousel({
                    navigation : true, // Show next and prev buttons
                    autoPlay: false, //Set AutoPlay to 3 seconds
                    items : 1
                });
            });
        });
    })();
</script>

1 Ответ

1 голос
/ 25 сентября 2019

Вы можете использовать java-скрипт как этот 

<script>
    require(['jquery', 'owlcarousel'], function($) {
           $("#owlslider").owlCarousel({
                    navigation : true, // Show next and prev buttons
                    autoPlay: false, //Set AutoPlay to 3 seconds
                    items : 1
                });

    });
</script>

или Попробуйте это 

<script>
    require(['jquery', 'mgzOwlCarousel'], function($) {
    $("#owlslider").owlCarousel({
                        navigation : true, // Show next and prev buttons
                        autoPlay: false, //Set AutoPlay to 3 seconds
                        items : 1
                    });

        });
    </script>
...