Jump to content

TAY

Neophyte
  • Posts

    1
  • Joined

  • Last visited

TAY's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Здравствуйте. Задумка: использовать плагин (jquery) Easyzoom на галерее картинок, предназначенный для показа увеличенного фрагмента изображения. Лупа, короче. Работа плагина следующая. <a href='src_pic_lrg'><img src='src_pic_sml'></a>- при наведении курсора на картинку(точнее на ссылку) плагин берет href, в котором указан большой вариант картинки и показывает ее в отдельном div. Это все отлично. но я имею набор картинок, которые переключаются в одном div. Проблема в том, что как ни переключай ссылки, все равно считываться будет href, который написан последним. то есть не переключается вовсе. я переключал zIndex div'ов, в каждом из которых помещено по ссылке. экспериментировал с display:none на div и самих ссылках. Все равно последний href как насквозь все собой пронзает. Может идейку какую кто подскажет, как с картинками a href переключать. у cloudzoom это реализовано каким-то макаром, но я так и не врубился как... привожу минимальный, но аналогичный по механизму код . <!DOCTYPE html><html><head><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script><script type="text/javascript" src="js/easyzoom.js"></script><script type='text/javascript'>jQuery(function($){$('a.zoom').easyZoom();});</script><style> #myDIV { position: absolute; top: 130px; left: 30px; width: 420px; height: 310px; background-color: lightblue; border: 1px solid black;} #DIV2 { position: absolute; top: 130px; left: 30px; width: 420px; height: 310px; background-color: coral; border: 1px solid black; }#easy_zoom{width:600px;height:400px; border:5px solid #eee;background:#fff;color:#333;position:absolute;top:60px;left:500px;overflow:hidden;-moz-box-shadow:0 0 10px #777;-webkit-box-shadow:0 0 10px #777;box-shadow:0 0 10px #777;line-height:400px;text-align:center;}</style></head><body><button onclick="myFunc()">меняем</button><div id="DIV2"><a id='forsh0' class='zoom' href='foto4.jpg'><img class='pict' width=420 height=310 src='foto4.jpg '></a></div><div id="myDIV"><a id='forsh1' class='zoom' href='foto5.jpg'><img class='pict' width=420 height=310 src='foto5.jpg '></a></div><script>function myFunc() { document.getElementById("myDiv").style.zIndex = "-1";}</script></body></html>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy