Дублируется первый элемент слайдера, как исправить?

Question

[Сергей]

На главной https://posteffect.ru/ сделан слайдер.
Активировано 3 слайда, но почему-то выводится 5 элементов . Первый и последний class="bx-clone". Из-за этого ссылки по баннерам некликабельные.

Вывод слайдера

<? if (!empty($arResult['ITEMS'])): ?>
    <div class="promo"><span class="bx-slider-prev"></span><span class="bx-slider-next"></span>
        <div class="slider">
            <ul class="list-unstyled list-inline">
                <? foreach ($arResult['ITEMS'] as $arItem): ?>
                    <li>
                        <? if (!empty($arItem['DISPLAY_PROPERTIES']['LINK']['VALUE'])): ?>
                            <? if ('Y' === $arItem['DISPLAY_PROPERTIES']['LINK_EXTERNAL']['VALUE_XML_ID']): ?>
                            <? endif; ?>
                            <a href="<?= $arItem['DISPLAY_PROPERTIES']['LINK']['VALUE']; ?>" title="<?= $arItem['PREVIEW_TEXT']; ?>" <? if ('Y' === $arItem['DISPLAY_PROPERTIES']['LINK_EXTERNAL']['VALUE_XML_ID']): ?>rel="nofollow"<? endif; ?>>
                        <? endif; ?>
                            <? if ($arItem['DISPLAY_PROPERTIES']['IMAGE_1000']['FILE_VALUE']['SRC']): ?>
                                <span class="visible-md visible-lg slide-1000" style="background: url('<?= $arItem['DISPLAY_PROPERTIES']['IMAGE_1000']['FILE_VALUE']['SRC']; ?>'); background-position: center <?= $arItem['DISPLAY_PROPERTIES']['POSITION_1000']['VALUE_XML_ID']; ?>;"></span>
                            <? endif; ?>
                            <? if ($arItem['DISPLAY_PROPERTIES']['IMAGE_720']['FILE_VALUE']['SRC']): ?>
                                <span class="visible-sm slide-720" style="background: url('<?= $arItem['DISPLAY_PROPERTIES']['IMAGE_720']['FILE_VALUE']['SRC']; ?>'); background-position: center <?= $arItem['DISPLAY_PROPERTIES']['POSITION_720']['VALUE_XML_ID']; ?>;"></span>
                            <? endif; ?>
                            <? if ($arItem['DISPLAY_PROPERTIES']['IMAGE_480']['FILE_VALUE']['SRC']): ?>
                                <span class="visible-xs slide-480" style="background: url('<?= $arItem['DISPLAY_PROPERTIES']['IMAGE_480']['FILE_VALUE']['SRC']; ?>'); background-position: center <?= $arItem['DISPLAY_PROPERTIES']['POSITION_480']['VALUE_XML_ID']; ?>;"></span>
                            <? endif; ?>
                            <? if ($arItem['DISPLAY_PROPERTIES']['IMAGE_320']['FILE_VALUE']['SRC']): ?>
                                <span class="visible-xs slide-320" style="background: url('<?= $arItem['DISPLAY_PROPERTIES']['IMAGE_320']['FILE_VALUE']['SRC']; ?>'); background-position: center <?= $arItem['DISPLAY_PROPERTIES']['POSITION_320']['VALUE_XML_ID']; ?>;"></span>
                            <? endif; ?>
                        <? if (!empty($arItem['DISPLAY_PROPERTIES']['LINK']['VALUE'])): ?>
                            </a>
                            <? if ('Y' === $arItem['DISPLAY_PROPERTIES']['LINK_EXTERNAL']['VALUE_XML_ID']): ?>
                            <? endif; ?>
                        <? endif; ?>
                    </li>
                <? endforeach; ?>
            </ul>
        </div>
        <div id="bx-pager" class="pagination text-center">
            <? foreach ($arResult['ITEMS'] as $index => $arItem): ?>
                <a href="#" title="<?= $arItem['NAME']; ?>" data-slide-index="<?= $index; ?>"></a>
            <? endforeach; ?>
        </div>
    </div>
<? endif; ?>

Answer 1

[Andrey Suha]

Cылки не кликабельны не из-за количества слайдов, а из-за того что на них стоит e.preventDefault, а слайды дублируются для того что бы была бесконечная прокрутка

Answer 2

[Максим Сиваконь]

Используйте OWL слайдер и будет точно такой же функционал как на том сайте!

Comments

[Сергей]

Спасибо, попробую.