Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.02.2013, 16:46
Новичок на форуме
Отправить личное сообщение для Artyom K Посмотреть профиль Найти все сообщения от Artyom K
 
Регистрация: 27.02.2013
Сообщений: 5

Картинка, связанная с ссылкой
Всем доброго времени суток,

Есть картинка и ссылка
<img src="img.png">
<a href="#" data-reveal-id="myModal">Click here</a>

Ссылка ведет к библиотеке JQuery. При нажатии по ней плавно выдвигается модальное окно.

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

Это было бесполезно
<a href="#" data-reveal-id="myModal"><img src="img.png"></a>

И при корректировке в JQuery тоже
$('img[src*=img.png]').live...;
$('a img[src*=img.png]').live...;

Код такой
$('a[data-reveal-id]').live('click', function(e) {
e.preventDefault();
var modalLocation = $(this).attr('data-reveal-id');
$('#'+modalLocation).reveal($(this).data());
});
и т.д.

Я озадачен, прошу помощи.

P.S. Можно ли каким-нибудь способом связать картинку с ссылкой через тот же JQuery? Вроде нажимаешь на картинку, а открывается невидимая ссылка.

Ну или...
Ответить с цитированием
  #2 (permalink)  
Старый 27.02.2013, 17:21
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Попробуй так

<img data-reveal-id="myModal" src="img.png">
$('img[data-reveal-id]').live('click', function(e) {
...


upd:
И вообще, если дописывать везде data-reveal-id="bla-bla", то можно ограничиться
$('[data-reveal-id]').live('click', function(e) {

Последний раз редактировалось Serg_pnz, 27.02.2013 в 17:27.
Ответить с цитированием
  #3 (permalink)  
Старый 27.02.2013, 17:26
Новичок на форуме
Отправить личное сообщение для Artyom K Посмотреть профиль Найти все сообщения от Artyom K
 
Регистрация: 27.02.2013
Сообщений: 5

Так тоже делал. Не выходит. Оно и понятно.

$('img[data-reveal-id]').live('click', function(e) {
e.preventDefault();
var modalLocation = $(this).attr('data-reveal-id');
$('#'+modalLocation).reveal($(this).data());
});

Код для картинки некорректен
Ответить с цитированием
  #4 (permalink)  
Старый 27.02.2013, 17:27
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Artyom K,
ты в самой картинке прописал?
<img data-reveal-id="myModal" src="img.png">
Ответить с цитированием
  #5 (permalink)  
Старый 27.02.2013, 17:28
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

http://learn.javascript.ru/play/ESofG - всё работает, кликай по картинке или ссылке
Ответить с цитированием
  #6 (permalink)  
Старый 27.02.2013, 18:20
Новичок на форуме
Отправить личное сообщение для Artyom K Посмотреть профиль Найти все сообщения от Artyom K
 
Регистрация: 27.02.2013
Сообщений: 5

http://learn.javascript.ru/play/CE38kb
кинул весь скрипт, так легче

Видимо, причина в live, с on у меня тоже работало
...$('[data-reveal-id]').on...
Ответить с цитированием
  #7 (permalink)  
Старый 27.02.2013, 20:03
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Artyom K,
епт, так гладиолус!
$('a[data-reveal-id]').live('click', function(e) {
а - лишнее!
http://learn.javascript.ru/play/fd0Fg
Ответить с цитированием
  #8 (permalink)  
Старый 27.02.2013, 20:04
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

кстати on ввели с 1.7, а ты вроде 1.6 используешь (лениво разбираться детально)
Ответить с цитированием
  #9 (permalink)  
Старый 27.02.2013, 20:28
Новичок на форуме
Отправить личное сообщение для Artyom K Посмотреть профиль Найти все сообщения от Artyom K
 
Регистрация: 27.02.2013
Сообщений: 5

Чёрт, всё было намного проще. Про a всё ясно, дело было и не в этом.
У меня был ещё один глубокий косяк. Я для одной картинки сразу две функции требовал: открытие модального окна и разворот текста снизу. Я думал, что можно использовать несколько функций.

Ладно, спасибо.
Ответить с цитированием
  #10 (permalink)  
Старый 27.02.2013, 20:33
Аватар для Serg_pnz
Сам по себе
Отправить личное сообщение для Serg_pnz Посмотреть профиль Найти все сообщения от Serg_pnz
 
Регистрация: 09.06.2009
Сообщений: 963

Можно, юзай что-то типа bind
http://jquery.page2page.ru/index.php...82%D0%B8%D0%B9
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
ПОМОГИТЕ разобраться со скриптом (картинка праздничного дня) Zhuk13@ya.ru Общие вопросы Javascript 7 08.12.2013 19:51
МИГАЮЩАЯ КАРТИНКА johnsag Элементы интерфейса 1 30.05.2012 11:39
При наведении на ссылку меняется картинка ucoz (jquery) pelimeshki jQuery 2 13.01.2012 01:53
Картинка обрабатывается js 4yBaK Общие вопросы Javascript 10 11.09.2011 09:28
Opera 11.00 не подгружается картинка greatilya Opera, Safari и др. 1 27.12.2010 20:27