Координаты курсора на экране

[ale10ey]

Доброе время суток,

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

В данный момент скрипт, как я писал ранее находит img и координаты отображаются на экране и с помощью:

Цитата:if (xy_class=='acad') { xy_pos_x=60; xy_pos_y=65; }

их можно поместить в нужное место, но для ссылки "Увеличить изображение" это не работает.
Есть вариант, конечно, такую ссылку сделать не текстовую:

<h5><a href="img/gallery/autocad.png" class="pirobox" title="Autodesk AutoCAD"></a></h5>

a сделать ее изображением и попробовать на работоспособность скрипта, но не думаю, что сработает, вот и требуется ваше профессиональная помощь.

По сути ссылка "Увеличить изображение" дублирует клик по изображению, где появляется с помощью скрипта pirobox 2 изображение и отображаются координаты.

Буду благодарен за помощь, а то ссылка "Увеличить изображение" имеется на 2 страницах, работает в плане вызова и появления 2 изображения, но координаты не работают. Вроде мелочь, но скрипт с координатами уже имеется и работает для изображения, а для ссылки - нет, пользователь может ведь кликнуть либо по изображению, чтобы его увеличить или по ссылке "Увеличить изображение", которая работает, но координаты - нет.

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

[Admin]

Что-то у меня не получается собрать страничку из приведенных Вами кодов, поэтому проверить на практике не могу...

В коде: $(".entry a").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });
присутствует буква a, обозначающая тег <a></a>.

Из-за этого не будет работать функция find("img") для ссылки "Увеличить изображение"! Т.к. данная функция ищет изображение внутри тега <a></a>, а для ссылки "Увеличить изображение" изображения внутри данной ссылки нет!

Предлагаю попробовать немного изменить структуру HTML кода (внести ссылку "Увеличить изображение" внутрь второго тега <a></a>, а первый удалить):

Код:

<div class="entry">

<h3><img src="img/icons/autocad.png" />Autodesk AutoCAD 2015</h3>

<a href="img/gallery/autocad.png" class="pirobox" title="Увеличить изображение">
<h5>&darr; Увеличить изображение</h5>
<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 -->

Возможно, поможет.

[ale10ey]

Здравствуйте,

Предлагаю попробовать немного изменить структуру HTML кода (внести ссылку "Увеличить изображение" внутрь второго тега <a></a>, а первый удалить):

<a href="img/gallery/autocad.png" class="pirobox" title="Увеличить изображение">

Цитата:<h5>&darr; Увеличить изображение</h5>

<img class="acad" src="img/gallery/autocad-image.png" alt="Autodesk AutoCAD" />
</a>

Так будет работать я проверял ранее и css можно добиться, чтобы все было нормально, но

Цитата:Вставлять блочные элементы внутрь строчных запрещено

, а ссылка - строчный, а тег h5 - блочный элемент.

Вот я и стал думать, как решить данную проблему...

---

P.S.: такой вариант будет работать для HTML 5, но HTML 4 / XHTML - не допускается внутри строчных размещать блочные элементы.

[Admin]

Так поместите весь код ссылки с изображением внутрь h5.

Либо сделайте так: <span class="h5">&darr; Увеличить изображение</span>
И оформите класс h5 как надо.

[ale10ey]

Здравствуйте,

Сделал немного по-другому

<h5><img class="acad" style="display: none;" src="img/gallery/autocad.png" alt="Autodesk AutoCAD" /><a href="img/gallery/autocad.png" class="pirobox" title="Autodesk AutoCAD">&darr; Увеличить изображение</a></h5>

<a href="img/gallery/autocad.png" class="pirobox" title="Увеличить изображение"><img class="acad" src="img/gallery/autocad-image.png" alt="Autodesk AutoCAD" /></a>

Т.е. в тег h5 добавил изображение и прописал display: none;

а скрипте добавил строчку:

$(document).ready(function(){
$(".entry a").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

Цитата: $(".entry h5").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

$(".unique").find("img").live('mousemove', function(e) {

Сейчас все работает, один вопрос можно ли в 1 строчке:
$(".entry a").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

сделать, так чтобы строчка работала и для .entry h5, а то приходится дублировать по сути первую строчку изменяя только класс.

Пробовал так:

$(".entry a, .entry h5").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

но, не работает.
Если прописать $(".pirobox") являющийся общим для .entry a и entry h5, также не работает, вот и пришлось 1 строчку дублировать изменяя только класс.

Заранее благодарен.

[Admin]

Код:

Код:

$(".entry a, .entry h5").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

прекрасно работает (точнее сказать срабатывает) и для .entry a и для .entry h5.

Только есть одно маленькое но! При клике по ссылке Увеличить изображение код срабатывает два раза, т.к. данная ссылка подходит под оба условия (".entry a" и ".entry h5") и при первом срабатывании неправильно определяется класс изображения. Это можно легко проверить, добавив alert($(this).find("img").attr("class")); перед xy_class=$(this).find("img").attr("class");

Лучше использовать такой код:

Код:

$(".entry>a,.entry>h5").live("click", function(e) { xy_class=$(this).find("img").attr("class"); });

Правда уже не помню почему мы стали использовать именно такой код, ведь код:

Код:

$(".entry>a,.entry>h5").click(function(){ xy_class=$(this).find("img").attr("class"); });

тоже работает.

[ale10ey]

Спасибо , совсем забыл, что можно использовать > для entry a и entry h5.

С уважением .

[ale10ey]

Здравствуйте, вопрос не совсем по существу, но решил привязать его к этой теме.

У меня в данный момент на сайте имеется плагин jQuery версии 1.3.2 и все работает нормально, решил обновить плагин к примеру попробовал версию 1.8.3, хотя это уже далеко не новая версия, все работает, за исключением кнопки "Escape"/

Поясню, когда я кликаю на изображении размерами (110x150), экран затемняется и плавно появляется 2 изображение (размерами 800x500) с помощью скрипта pirobox и при использовании плагина jQuery версии 1.3.2 я мог выйти из просмотра нажатием кнопки Escape на клавиатуре или кнопки "close" на самом изображении, сейчас при клике на кнопку Escape изображение не закрывается.

На всякий случай решил приложить 2 скрипта

  jQuery.rar (Размер: 50.19 Кб / Загрузок: 2)

И еще вопрос, более новый jQuery плагин jquery_1.11.2.min.js или jQuery версии v2.0.3 не работают совсем, ни для слайд-шоу, ни для скрипта pirobox, почему так происходит или тут надо смотреть каждый код в отдельности или более новые скрипты не поддерживают мои скрипты, хотя jQuery версии 1.8.3 работает, за исключением кнопки Escape, а более новые версии не работают.

С уважением и заранее благодарен, Алексей.

---

P.S.: Забыл добавить, что пробовал делать и таким образом:

PHP код:

<script type="text/javascript">
jQuery.noConflict();
(function($){

Тут располагается наш jQuery код

})(jQuery);
</script> 


Пробовал как версию 1.11.2, так и 2.03 - не работает, т.е это не какой-то jQuery файл, а сам основной плагин, он же по сути на всех страницах есть и должен работать, но не работает совсем...

[Admin]

jQuery это библиотека и она постоянно развивается. Появляется новый функционал, а что-то постепенно устаревает. Вот так похоже и произошло с Вашими скриптами - более новая библиотека jQuery перестала поддерживать какие-то функции или параметры функций используемые в плагине piroBox_1.2.min.js.

Тут надо либо отказаться от обновления библиотеки jQuery, либо искать более новую версию piroBox (если она вообще обновлялась).

[ale10ey]

Здравствуйте, спасибо за ответ, но сам разобрался.

Для тех, кому может быть информация пригодится.
Скачал с официального сайта плагин jQuery версии 1.11.3, который поддерживает ie7/8/9, но этого оказалось недостаточно, необходимо также плагин jQuery Migratе и при подключении 2 плагинов все работает.

Кстати, строчки

Цитата:jQuery.noConflict();
(function($){

Тут располагается наш jQuery код

})(jQuery);

для этих плагинов не нужны, с ними он работать не будет, по крайней мере в моем случае.

У меня к вам только 1 вопрос, как реализовать в новом jQuery версии 1.11.3, чтобы кнопка Escape работала, в старом плагине она работает (для закрытия изображения), нужно добавить в код строчку для клавиши "Escape".

Заранее благодарен.

---

P.S.: Пробовал добавлять такую строчку, но не вышло:
$().bind("keydown", function © { if (c.keyCode === 27) { $.css("display","none"); }});