Iframe已加载但未在Iphone上显示

时间:2019-05-31 10:55:06

标签: javascript html ios css iframe

在我使用html,css,javascript和bootstrap帮助构建的网站(https://lauraseiler.com/rise-up-and-shine-university/2019)上,有一个“播放”按钮,该按钮删除了覆盖在iframe顶部的图像,并开始从Vimeo自动。为此,我使用Javascript。此方法运行良好,并且仍可在桌面上使用,但最近在iPhone上无法使用。视频开始播放,但不可见。当手机在横向模式下打开时可见,而在纵向模式下则看不到。

我试图更改iframe和图片的z索引,但这没用。

<div class="container0-fluid">
    <div class="header-video">
        <picture class="video-header-img">
            <source media="(max-width: 576px)" srcset="img/sm/bg-masthead.jpg">
            <img data-src="img/lg/bg-masthead.jpg" alt="" class="lazy video-thumbnail-img" data-pin-nopin="no">
        </picture>
        <div class="video-wrapper">
            <iframe
                src="https://player.vimeo.com/video/303572289?api=1&autoplay=0&loop=0&title=0&byline=0&portrait=0&muted=0&player_id=vvimeoVid"
                id="iframePlayer" scrolling="no" webkitallowfullscreen mozallowfullscreen allowfullscreen
                ontouchstart=""></iframe>
        </div>
        <a href="#" class="video-play-header pulse"><img src="img/icons/play2.png"></a>
        <a href="#intro" class="scroll-down js-scroll-trigger" address="true"><span
                class="tooltiptext text-borderTop-bold">Starte
                deine Reise</span></a>
        <img class="rusu-logo" src="img/logo/RUSU_Hauptlogo_gold.png" data-pin-nopin="no">
    </div>
</div>

我希望在单击播放按钮并移除位于顶部的图像后,iframe会居中显示。该错误不会在Chrome或Safari的iOS桌面版中发生,并且也适用于Android手机。

0 个答案:

没有答案