某些移動設備上未顯示圖像

Question

我已經為我們的網站上傳了一個新的標題圖片，盡管它在上升時可以在所有手機上正確顯示，但仍有幾個人只看到一個黑色的正方形。

該代碼已設置為可以在台式機（可能的情況下為1400x900）中挑選視頻，然后在需要時切換至較小版本，因此，在任何頁面上實際調用的唯一內容是1400（或視頻）。

<ul class="list">
    <li>
        <span><img src="/img/writing-briefs-1400.jpg" width="1400" height="900" alt=""></span>
        <span style="background:rgba(153,153,153,0.9)">Theme. <small>#worklife</small></span>
    </li>
</ul>

<div class="intro">
    <div class="visual">    
        <video autoplay preload="auto" autoplay loop webkit-playsinline>
            <source src="/vid/sign-briefs.webm" type="video/webm">
            <source src="/vid/sign-briefs.mp4" type="video/mp4">                    
        </video>
        <img class="js_bg" src="/img/writing-briefs-1400.jpg" width="1400" height="900" alt="">
    </div>
    <div class="detail" style="background:rgba(153,153,153,0.9)">
        <div>
            <h2>Theme. <small>#worklife</small></h2>
            <p>A lighthearted take on the corporate jargon that we encounter while working in a creative environment. First up, 'Writing Briefs'!</p>
            <a href="/news/news.html" class="view" data-label="Latest News">Loading&hellip;</a>             
        </div>
    </div>
</div>

盡管如此，盡管我可以在HTC One上看到圖像，但iPhone和Samsung上的用戶卻看不到它。 但是代碼塊的設置與另一張可以正常輸出的幻燈片的設置相同。 我想念什么？

Answer 1

只是一個建議-嘗試使用不透明的背景（alpha 1.0）。 另外，當您想快速進行測試時-您可以測試在Safari中顯示圖像（如果Safari中為黑色，對於iPhone，它也將為黑色）。