Slick slider with inside iframe issue

Question

Using Slick slider and inside I added the iframe, after integrating the iframe, scrolling functionality doesn't work. How do I solve the issue and get the scrolling?

Given HTML below:

HTML:

<div class="smaller-cards">
    <div>
        <div class="content">
            <div class="mkt-val">
                <iframe src='https://someurl.com' frameborder='0'></iframe>
            </div>
        </div>
    </div>

    <div>
        <div class="content">
            <div class="mkt-val">
                <iframe src='https://....' frameborder='0'></iframe>
            </div>
        </div>
    </div>

    <div>
        <div class="content">
            <div class="mkt-val">
                <iframe src='https://....' frameborder='0'></iframe>
            </div>
        </div>
    </div>
</div>

JS:

$('.smaller-cards').slick({
    infinite: false,
    slidesToShow: 5,
    slidesToScroll: 3,
    variableWidth: true,
    arrows: false
});

Answer 1

在iframe元素上尝试使用此属性！更多信息，请点击https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

pointer-events: none;