Здравствуйте,
В последний раз, сразу к сожалению не заметил, просьба извинить не проверил на работоспособность скрипта для ссылки "Увеличить изображение", если кликнуть по самому изображению, то скрипт работает прекрасно.
1. Код js:
var xy_class='';
var xy_pos_x=0;
var xy_pos_y=0;
$(document).ready(function(){
$("
.entry a").live("click", function(e) { xy_class=$(this).find("
img").attr("class"); });
$(".unique").find("
img").live('mousemove', function(e) {
if (xy_class=='acad') { xy_pos_x=60; xy_pos_y=65; }
else if (xy_class=='review') { xy_pos_x=50; xy_pos_y=40; }
var relativeX = e.pageX - Math.floor($(this).offset().left);
var relativeY = e.pageY - Math.floor($(this).offset().top);
$(".xy_pos").html("X = " + relativeX + " Y = " + relativeY); /* <span class="xy_pos2"></span> */
$(".xy_pos").css({"right":"0","margin-right":$(".pirobox_content").offset().left+xy_pos_x,
"top":"0","margin-top":$(".pirobox_content").offset().top+$(".pirobox_content").outerHeight()-xy_pos_y});
});
$("a.pirobox").bind("click",function(d) { $(".xy_pos").css("display","block"); });
$(".piro_close").live("click", function(e) { $(".xy_pos").css("display","none"); });
$().bind("keydown", function ( c ) { if (c.keyCode === 27) { $(".xy_pos").css("display","none"); }});
});
2. Скриншот для наглядности, где ссылка "Увеличить изображение" работает, т.е скрипт pirobox запускается появляется 2 изображение, а вот координаты отображаются, но за пределами изображения, если же кликнуть по изображению, тут все нормально, координаты появляются согласно js скрипта строчки:
Цитата:if (xy_class=='acad') { xy_pos_x=60; xy_pos_y=65; }
3. Сам код html:
<div class="
entry">
<h3><img src="img/icons/autocad.png" />Autodesk AutoCAD 2015</h3>
<h5><a href="img/gallery/autocad.png" class="pirobox" title="Autodesk AutoCAD">↓
Увеличить изображение</a></h5>
<a href="img/gallery/autocad.png" class="pirobox" title="Увеличить изображение"><img class="acad" src="img/gallery/autocad-image.png" alt="Autodesk AutoCAD" /></a>
<div class="right">
<p>Lorem Ipsum is simply dummy text<p>
</div>
</div> <!-- entry ends -->
Для ссылки <a><img /></a> идущей после тега h5<a></a></h5> все нормально работает, а вот для тега h5 внутри которого ссылка "Увеличить изображение" координаты не работают должным образом.
Пытался сам добавлять h5 a в pirobox скрипт, но не работает:
Цитата:$(document).ready(function(){
$(".entry a").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });
$(".unique").find("img").live('mousemove', function(e) {
При таком подходе работает ссылка <a><img /></a> идущая после тега h5<a></a></h5>, а координаты для ссылки "Увеличить изображение" не работают.
Надеюсь я более или менее изъяснился правильно, надеюсь сможете помочь несмотря, что тема не новая.
С уважением и заранее благодарен
.