Страница начальной загрузки некорректно отображается в Safari

#html #css #twitter-bootstrap #jquery-backstretch

#HTML #css #twitter-bootstrap #jquery-backstretch

Вопрос:

Я использую Bootstrap и backstretch (http://srobbin.com/jquery-plugins/backstretch /) для создания простого статического веб-сайта. При тестировании в разных браузерах я обнаружил, что она неправильно загружается в Safari. Я понимаю, что часть моего кода не очень чистая, поскольку это незавершенная работа, но содержимое отлично отображается в других браузерах, поэтому я в тупике.

Обычно при этом отображается div, равный полной ширине страницы и 95% высоты окна просмотра. Затем этот div заполняется изображением с использованием backstretch. В случае safari изображение вообще не отображается, а текст перекрывается со следующим набором html.

  <div class="row" style=" height:95vh; position: relative;" id="frontpage" > 

       <div class="col-lg-offset-2 col-lg-8 col-md-offset-2 col-md-8 col-sm-offset-1 col-sm-10 text-center " style="position: absolute; top: 67%;">
           <h1  style="color:white; " id="title">
            Just Some Title Text </h1>
           <h4 style=" color:#D5D5D5;   float:none;  " id="tagline"> 
           This is my secondary text. </h4>

     </div>
   </div>
<script> $("#frontpage").backstretch("img/FP2D.jpg");</script>
  

Комментарии:

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

2. Я добавил соответствующие фрагменты кода выше. Спасибо за помощь.

3. Вы также можете объяснить или показать, чем Safari отличается от других браузеров. Предоставленная информация, на мой взгляд, должна более подробно объяснить проблему.

4. Помогает ли добавленное мной объяснение?

Ответ №1:

спасибо всем, кто взглянул и попытался найти ответ. Оказывается, safari, который я использовал, был 5.1.7, который серьезно устарел. Таким образом, различия в рендеринге полностью понятны.