Проблемы совместимости с iPhone (HTML)

В Вебе, который я сделал, я появились проблемы с iPhones. Со всеми остальными устройствами функционируй правильно, так Android, включенный Windows с MacOS, с различными браузерами. Но если использование Safari в iOS я появляются несколько проблем, как например отобразив видео:


С этим кодом во всех браузерах, который открывает веб-страницу, видео авторазмножается, взамен в ios выходит видео с кнопкой play, и если ты даешь ему, открывается видео из-за того, что так это говорит в закладке в часть.

Кроме того у меня есть кнопка, чтобы пересылать наверху, что во всех браузерах такой, который я схватил: introducir la descripción de la imagen aquí

Но открыв это с iPhone, видят плохо, где стрела внутри не центрована:

introducir la descripción de la imagen aquí

Код кнопки:



#upbutton{
    color:#FFFFFF;
    position:fixed;
    border-width:3px;
    border-color:#FFFFFF;
    border-radius:50%;
    background-color:#337de6;
    opacity:0.6;
    bottom:90px;
    right:30px;
    width:60px;
    height:60px;
    font-size:30px;
    z-index:100;
}

1
задан 20.06.2017, 20:44
2 ответа

Проблема видео немного известна, и что уже был прокомментирован в других вопросах. Обобщая: обычно в подвижных браузерах не авторазмножаются видео, чтобы избегать того, чтобы было сделано нежелательное использование данных.

На cóme видно изображение плохо в iPhone и iOS, я смог воспроизводить проблему. Мне кажется, что он проистекает из того, как относится Safari к шрифту и glyphicons: поскольку ты не поместил ему никакого стиля в особенности, каждый браузер это интерпретирует, как он имел определенный по умолчанию.

То, что ты мог бы делать, состоит в том, чтобы гарантировать тебе, что flechita разместит себе в центре posicionándola категорически внутри синего круга. Немного как это (что да функционирует в iOS):

#upbutton{
    color:#FFFFFF;
    position:fixed;
    border-width:3px;
    border-color:#FFFFFF;
    border-radius:50%;
    background-color:#337de6;
    opacity:0.6;
    bottom:90px;
    right:30px;
    width:60px;
    height:60px;
    font-size:30px;
    z-index:100;
}

#upbutton i {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  -webkit-transform:translate(-50%, -50%);
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />

<button id="upbutton"><i class="glyphicon glyphicon-chevron-up"></i></button>
1
ответ дан 24.11.2019, 12:17
  • 1
    В iOS10, уже позволь reproducció n automá костариканская под некими точками. Я существую añ adido ответ в вопросе, quizá s я заинтересовал тебя читать ее :) – Hoose 02.12.2016, 20:19
  • 2
    Однажды cetrada стрела в кругу, также menhe отчитанный, что вместо того, чтобы быть cí rculo, это одна овально, сплющена..., как возможно решать это? – Pavlo B. 09.12.2016, 10:36
  • 3
    @PavloB. ¿ Конечно, что нет другого CSS, чем esté касаясь botó n, и что способствовал тому, чтобы он укоренился? Тестируя có я говорю о вопросе, что в iOS9 я это вижу хорошо. – Alvaro Montoro♦ 09.12.2016, 13:55
  • 4
    Если, безопасный, только есть файл css. – Pavlo B. 13.12.2016, 17:55
  • 5
    @PavloB. Ok, я смог видеть botó n овальный. Кажется, что это проблема из-за có mo iOS отнесись к краям. Если ты помещаешь ему ширину края 0px, тогда кажется, что уже виден botó n округленный (как в этот JSFiddle ). И если ты хочешь, чтобы у него был этот белый край 3 pixels (хотя só lido вместо outset), podrí схвати помещать ему тень помести (как в этом другом JSFiddle ). – Alvaro Montoro♦ 13.12.2016, 18:27

Если они используют iOS 10, видео уже могут быть воспроизведенными автоматически, но с какими-то ограничениями...

  • Элемент <video> он будет уважать признак autoplay, всякий раз когда были выполнены следующие условия:
1
ответ дан 24.11.2019, 12:17
  • 1
    Тогда, нет способа заставлять это функционировать, не имея 10 ios? Всегда quesará así? – Pavlo B. 09.12.2016, 10:33