<div id="box"><button id="btn">кнопка</button></div>
document.getElementById("box").addEventListener("click",
function(e){
e = e || window.event;
var target = e.target || e.srcElement;
if(target.id == "btn") alert("Клик по дочернему!");
}
);
var arrPop = ['a', 'b', 'c'];
function servicePopup(params) {
function test (arr,index) {
if(!arr[index]) return;
$('body').removeClass('popup_opened');
$('body').removeAttr('style');
$('.popup__item').css('display', 'none');
$('.popup__item_js').find($('.popup__item__content')).html(arr[index]);
$('body').addClass('popup_opened');
$('.popup__item_js').css('display', 'inline-block');
$('.popup__item__close_js').on('click', function() {
test(arr,index++);
// код закрытия окна
});
}
if (arrPop.length > 0) {
test(params,0);
} else {
console.log('empty');
}
}
servicePopup(arrPop);
<!-- Ссылки -->
<a href="#" id="https://www.youtube.com/embed/aaaaaaaa1" onclick="$('#video_frame').attr('src',this.src);$('#show_video_window').arcticmodal();">Посмотреть видео 1</a>
<a href="#" id="https://www.youtube.com/embed/aaaaaaaa2" onclick="$('#video_frame').attr('src',this.src);$('#show_video_window').arcticmodal();">Посмотреть видео 2</a>
<!-- Модальное окно -->
<div style="display:none;">
<div class="box-modal" id="show_video_window">
<!-- src должно меняться, в зависимости от id -->
<iframe id="video_frame" width="480" height="360" src="https://www.youtube.com/embed/xFa2_PVMeDQ"></iframe>
</div>
</div>
/*
TOOLTIP
*/
$( document ).ready( function()
{
var targets = $( '[rel~=tooltip]' ),
target = false,
tooltip = false,
title = false;
targets.bind( 'mouseenter click', function()
{
target = $( this );
tip = target.attr( 'title' );
tooltip = $( '<div id="tooltip"></div>' );
if( !tip || tip == '' )
return false;
target.removeAttr( 'title' );
tooltip.css( 'opacity', 0 )
.html( tip )
.appendTo( 'body' );
var init_tooltip = function()
{
if( $( window ).width() < tooltip.outerWidth() * 1.5 )
tooltip.css( 'max-width', $( window ).width() / 2 );
else
tooltip.css( 'max-width', 340 );
var pos_left = target.offset().left + ( target.outerWidth() / 2 ) - ( tooltip.outerWidth() / 2 ),
pos_top = target.offset().top - tooltip.outerHeight() - 20;
if( pos_left < 0 )
{
pos_left = target.offset().left + target.outerWidth() / 2 - 20;
tooltip.addClass( 'left' );
}
else
tooltip.removeClass( 'left' );
if( pos_left + tooltip.outerWidth() > $( window ).width() )
{
pos_left = target.offset().left - tooltip.outerWidth() + target.outerWidth() / 2 + 20;
tooltip.addClass( 'right' );
}
else
tooltip.removeClass( 'right' );
if( pos_top < 0 )
{
var pos_top = target.offset().top + target.outerHeight();
tooltip.addClass( 'top' );
}
else
tooltip.removeClass( 'top' );
tooltip.css( { left: pos_left, top: pos_top } )
.animate( { top: '+=10', opacity: 1 }, 50 );
};
init_tooltip();
$( window ).resize( init_tooltip );
var remove_tooltip = function()
{
tooltip.animate( { top: '-=10', opacity: 0 }, 50, function()
{
$( this ).remove();
});
target.attr( 'title', tip );
};
target.bind( 'mouseleave', remove_tooltip );
tooltip.bind( 'click', remove_tooltip );
});
});
(function() {
var contentReview = document.querySelectorAll('.reviews__text');
var moreBtnReview = document.querySelectorAll('.reviews__more');
var num = 120;
for (var i = 0; i < contentReview.length; i++) {
var bigTextReview = contentReview[i].innerHTML;
var cutTextReview = bigTextReview.slice(0, num);
moreBtnReview[i].style.display = 'none';
if (bigTextReview.length > num) {
moreBtnReview[i].style.display = '';
var vis = false;
var toggle1 = function(key) {
console.log(key);
if (!vis) {
contentReview[key].innerHTML = cutTextReview;
moreBtnReview[key].textContent = 'Подробнее';
vis = true;
} else {
contentReview[key].innerHTML = bigTextReview;
moreBtnReview[key].textContent = 'Скрыть';
vis = false;
}
};
moreBtnReview[i].addEventListener('click', function(key){return function(){toggle1(key);}}(i));
toggle1(i);
}
}
})();
moreBtnReview[i].addEventListener('click', function(key){return function(){toggle1(key);}}(i));
ui.draggable.clone().appendTo(this).draggable();
ui.draggable.appendTo(this).draggable();