Как работает popup окно - Страница 2 - Дизайн и модификация Invision Power Board

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

Копаю

hideClose: true,

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

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

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

  
$$('.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();
       
   });
});

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

Сообщение изменено: Testweb (12 Декабрь 2015 - 14:03)

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

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

Я хз, так

$$('.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();	
            });	              
      });

});

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

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

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

Даже если убрать
this.observe('mouseout', function(e){
pop.hide();
});

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

Я помню что там были какие-то косяки с аттачем евентов к элементам. Просто тупо не хотели повторно срабатывать. С чем это связано так и не разобрался, возился долго, в итоге тоже какие-то костыли приделал.
Но в данном случае ошибка как минимум в { target: elem, position: 'auto'} - elem это переменная цикла, вместо нее нужно использовать this.
popup - одна переменная для всех элементов. Попробуйте вместо нее массив, или непосредственно указать ее к элементу this.popup = new ipb.Popup

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

<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>

Рабочий

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

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

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

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

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

Testweb сказал(а):

Где?

Testweb сказал(а):

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

Цитата

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

Testweb сказал(а):

Тут используются Hovercards.
Вообще можно их задействовать.