2013-07-25 2 views
-1

Я пытаюсь реализовать масштабное всплывающее окно на моем веб-сайте. Он работает на IE10, Firefox заканчивается даже на iPad. Но по некоторым причинам изображения не отображаются в IE8 во всплывающем режиме. (Я не проверял IE9). Все это показывает белый экран. В чем может быть проблема? Вот моя ссылка: http://www.fietseling.org/media/routes2013/index.htmlВсплывающее окно, не показывающееся в IE (с помощью magnific-popup)

Этот код: Magnific Popup

<!-- Magnific Popup core CSS file --> 
<link rel="stylesheet" href="http://www.fietseling.org/templates/nuni_fietseling/css/magnific-popup.css"> 

<!-- jQuery 1.7.2+ or Zepto.js 1.0+ --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

<!-- Magnific Popup core JS file --> 
<script type="text/javascript" src="http://www.fietseling.org/templates/nuni_fietseling/js/jquery.magnific-popup.js"></script> 
</head> 
<body> 
<div class="window-content"> 

<img src="fotos/routekaart2013fotos_groot2.jpg" width="3000" height="1809" border="0" usemap="#Map"/> 
<map name="Map"> 
    <area shape="rect" coords="420,25,570,75" alt="Fietseling" href="http://www.fietseling.org/routes/algemene-routekaart"> 
    <area shape="rect" coords="1320,490,1350,515" alt="Fietseling" class="test-popup-link" href="fotos/hers01_miemaan.jpg"> 
</map> 
</div> 
<script> 
$(document).ready(function() { 
    $('.test-popup-link').magnificPopup({type:'image'}); 
}); 
</script> 
</body> 
</html> 

Большое спасибо

+1

где всплывающее окно? что мне делать, чтобы получить всплывающее окно? разместить соответствующий код? – Praveen

+0

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

+0

Если вы разместите соответствующий код, вам будет намного легче помочь. – Qiu

ответ

0

Я думаю, что я получил вашу проблему.

Когда я проверил инструмент разработчика, я обнаружил, что веб-страница использует режим документа

в IE5 причуды

Скриншот:

enter image description here

К исправить использование X-UA-Compatible

!-- Force IE to use the latest version of its rendering engine --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 

в вашем head тег.

Надеюсь, вы понимаете :)

+0

Я добавил мета-строку на страницу, но, похоже, она не решает проблему всплывающих окон. –

+0

С вашим советом о режимах я также использовал режим разработчика и увидел, что он не работает в режиме Quirks, и когда я меняю его на стандарты IE8, он работает. Я добавил инструкцию DOCTYPE, чтобы избежать режима quirks. Спасибо. –

+0

@MarcWillems Рад слышать, мой ответ помог вам. – Praveen

Смежные вопросы