как добавить увеличение фото плагином fotorama

Пробую добавить увеличение фото по нажатию в плагине fotorama. Я использую этот код для увеличения активного изображения, но этот код работает для всех элементов на странице.

jQuery("div:contains('fotorama__stage__frame fotorama__fade-rear fotorama__loaded     fotorama__loaded--img fotorama__active'):contains('img .fotorama__img')").click(function () {
    var o=jQuery(this).parent();
    var url= jQuery("div:contains('--img fotorama__active')").find('img').attr('src');  
    var html='<a href="" class="clone"><img src="'+url+'" /></a>'
    o.append(html);
    o=o.find('.clone');
    o.animate({});
    console.log('click');
    o.click(function () {
        jQuery('.clone').remove();
    });
});

Как исправить этот баг? http://arngoldt.com/?page_id=18 — пример моего кода на этой странице.


person ilenka    schedule 08.10.2014    source источник


Ответы (1)


Вы используете очень странные селекторы. Попробуйте использовать jQuery(".fotorama__img").click(...) и jQuery(".fotorama__stage__shaft .fotorama__active img"). Кроме того, похоже, вы должны использовать событие fotorama:showend для получения большого изображения src, потому что оно отображается асинхронно. Для получения дополнительной информации см. страницу документации.

person Sergey    schedule 08.10.2014
comment
Сергей, спасибо за совет. Я использую событие fotorama:load. Но я не понимаю, как применить щелчок только к большой картинке. Теперь функция щелчка работает для кнопок «следующая + предыдущая» и изображений большого пальца. - person ilenka; 09.10.2014
comment
Этот селектор jQuery(".fotorama__stage__frame.fotorama__loaded.fotorama__loaded--img.fotorama__active img") возвращает только большую картинку. Попробуйте использовать его. - person Sergey; 09.10.2014
comment
Также вы можете использовать fotorama API для доступа к активному большому изображению. Вы можете сделать это примерно так jQuery(".fotorama").data("fotorama").activeFrame.$stageFrame - person Sergey; 09.10.2014
comment
Спасибо. Эта проблема решилась, но возникла другая проблема. Я вижу два клика в журнале консоли + два объекта с классом = клон. - person ilenka; 09.10.2014