Как работает popup окно

[Testweb 3]

Спс, вот только закрываться окно перестало...

 

Копаю

hideClose: true,

ничего не выходит

 

            elem.observe('mouseout', function(e){		
               if(popup)
                  popup.kill();
           });		

 

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

[Testweb 3]

  
$$('.blclass').each(function(elem){ 

 elem.observe('mouseover', function(e){

     Event.stop(e); 

     popup = new ipb.Popup('popup', {  
			type: 'balloon',
			stem: true,
			attach: { target: elem, position: 'auto'},
			hideAtStart: false,
			initial: 'hml',
			hideClose: true,
			w: '320px;',					
     });

     elem.observe('mouseout', function(e){
         if(popup)
               popup.kill();

  });
});

 

Почему модальные окна закрываются только по щелчку?

Изменено 12 декабря 2015 пользователем Testweb

[Testweb 3]

:unsure: Не подскажите? :unsure:

[siv1987 2628]

У меня закрывается и при mouse out. Смотрите в консоли ошибок и дебажите переменную popup. Она желательно быть локальной а не глобальной.

[Testweb 3]

Я хз, так

$$('.blclass').each(function(elem){ 

 elem.observe('mouseover', function(e){

     Event.stop(e); 

     popup = new ipb.Popup('popup', {  
               type: 'balloon',
               stem: true,
               attach: { target: elem, position: 'auto'},
               hideAtStart: false,
               initial: 'hml',
               hideClose: true,
               w: '320px;',  

    this.observe('mouseout', function(e){
	 pop.hide();	
           });	              
     });

});

 

работает, но не совсем верно. После закрытия, повторно не откроется... Ошибки в консоле отсутствуют

 

Я хз что делать...

[Testweb 3]

Окна по щелчку закрываются, почему?

 

Даже если убрать

this.observe('mouseout', function(e){

pop.hide();

});

[siv1987 2628]

Вы в консоли смотрели? Во первых в этом скрипте есть синтаксические ошибки, возьмите нормальный редактор и приведите код в порядок.

[siv1987 2628]

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

Но в данном случае ошибка как минимум в { target: elem, position: 'auto'} - elem это переменная цикла, вместо нее нужно использовать this.

popup - одна переменная для всех элементов. Попробуйте вместо нее массив, или непосредственно указать ее к элементу this.popup = new ipb.Popup

[siv1987 2628]

Вот рабочий пример с делегированием

 

<div id="test">
<a href="#" class="blclass" data-id=1>Test 1</a><br>
<a href="#" class="blclass" data-id=2>Test 2</a><br>
</div>

<script>
var popup;
$('test').observe('mouseover', function(event) {
var row = event.findElement('a.blclass');
if(row){
	popup = new ipb.Popup('popup', {
				type: 'balloon',
				stem: true,
				attach: {target: row},
				hideAtStart: false,
				initial: row.innerHTML,
				w: '320px;'
	});
}
});
$('test').observe('mouseout', function(event) {
var row = event.findElement('a.blclass');
if(row){
	if(popup){
		popup.kill();
		popup = false;
	}
}
});
</script>

[Testweb 3]

Рабочий ;)

 

Без обертки "<div id="test">", не получится никак?

[siv1987 2628]

Вы можете делегировать на любой общий родительский элемент. В данном случае это пример для наглядности. Костыль конечно, но я так и не разобрался что там с аттачами евентов. Проблема есть именно с типом balloon который прикрепляет модальное окно к элементу.

[Testweb 3]

Спасибо, сойдет :rolleyes:

[Testweb 3]

На счет временного интервала.

 

Гляжу есть такой параметр как "delay: 2000,", в моем случаи он не работает, почему?

[newbie 1723]

Гляжу есть такой параметр как "delay: 2000,",

Где?

в моем случаи он не работает, почему?

Потому что нужно читать внимательно описание.

delay: this is an object with keys 'show' and 'hide'

 

delay: { show: 2000, hide: 4000 },

[newbie 1723]

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

Тут используются Hovercards.

Вообще можно их задействовать.