JQuery привязки противоречивы

Question

JQuery привязки противоречивы

0

Как бы переписать этот код так, чтобы привязки не конфликтуют? У меня есть масштаб на эффекте зависания, который перестает отвечать, как только я нажимаю на изображение цели (чтобы показать видео Youtube).

  <script type="text/javascript">
//to scale up on hover
$('#videoandmapwrap').on({
    mouseenter: function () {
        current_h = $(this, 'img')[0].height;
        current_w = $(this, 'img')[0].width;
        $(this).stop(true, false).animate({
            width: (current_w * 2.7),
            height: (current_h * 2.7)
        }, 900);
    },
    mouseleave: function () {
        $(this).stop(true, false).animate({
            width: current_w + 'px',
            height: current_h + 'px'
        }, 400);
    }
}, 'img');

//to reveal from behind placeholder picture
   $('#videoandmapwrap').on("click","img",function(event){
     event.preventDefault();
      video = '<iframe class="piccon" width="200" height="200" src="'+ $(this).attr('data-video') +'"></iframe>';
      $(this).replaceWith(video);  
   });

     </script>

Vynce82 11 янв. 2014, в 05:30

Источник

0

Я был уверен, что переписывание кода с использованием делегирования событий решит проблему, но это не так! заранее спасибо!
Vynce82 11 янв. 2014, в 03:39

Теги:

javascript

jquery

binding

1 ответ

Ещё вопросы

Я был уверен, что переписывание кода с использованием делегирования событий решит проблему, но это не так! заранее спасибо!

erikrunia · Accepted Answer · 2014-01-11T01-44-00.000Z

я думаю, что из-за этой строки:

$(this).replaceWith(video);

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

Я вижу, как только я нажимаю, IMG перестает существовать - его заменяют на iframe. Я повторил код и изменил все IMG на iframe, и он сделал свою работу! спасибо большое эрикруния!