У меня есть некоторые проблемы для создания отзывчивых карт изображений с помощью плагина jQuery для Matt Stows. Я следовал всем советам, но карты изображений все еще не реагируют. Я надеюсь, что вы можете помочь. Эти инструкции (полная страница: https://github.com/stowball/jQuery-rwdImageMaps):Отзывчивое изображение Map-Plugin не работает
- Если возможно, добавьте правильную, безразмерные атрибуты ширину и высоту для вашего изображения карты изображений. Вы можете переопределить их в CSS, чтобы сделать их отзывчивыми.
- Добавить ссылку на JQuery на странице, предпочтительно в нижней части только перед закрытием
</body>
После JQuery, либо в блоке или в отдельном файле, звоните:
$('img[usemap]').rwdImageMaps();
Это мой код, я устанавливаю фиксированную ширину и высоту, которая перезаписывается в CSS.
<div class="banners">
<img src="wcf/images/blueTemptation/logo2.jpg" style="width: 980px; height: 80px; display:block;" alt="banner-x" usemap="#banner-y" />
<map name="banner-y"><area shape="rect" coords="560,1,765,79" href="http://www.filmfutter.com/" alt="Kgergrfr" title="Filmfutter Startseite">
</div>
в нижней части моего PHP Я поместил это:
<script src="https://raw.github.com/stowball/jQuery-rwdImageMaps/master/jquery.rwdImageMaps.min.js"></script>
<script>
$(document).ready(function(e) {
$('img[usemap]').rwdImageMaps();
});
</script>
В случае вам интересно, я изменил источник сценария к URL-адресу, потому что я не был уверен, о правильном пути на моем сервере , но это не должно быть проблемой.