Jump to content
Дизайн и модификация IPS Community IPBSkinsBETA
Search In
  • More options...
Find results that contain...
Find results in...
Sign in to follow this  
Testweb

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

Recommended Posts

Ребят, не подскажите как создать модальное окно в IPB, то окно когда наводишь на ник пользователя на гл.странице...

 

 

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

 

Как сделать так, чтобы при наведении на свой элемент, всплывало данное окно?

Share this post


Link to post
Share on other sites

Modal Windows - https://www.invisionpower.com/support/guides/_/advanced-and-developers/user-interface/modal-windows-r215

 

<a href="#" id="blockid">My popup window</a>

if($('blockid')){
$('blockid').observe('mouseover', function(e){
	Event.stop(e);

	var popup = new ipb.Popup('popupid', { 
		type: 'pane',
		initial: 'Html content here',
		hideAtStart: false,
		w: '600px',
		h: 250
	});
});
}

  • Upvote 1

Share this post


Link to post
Share on other sites

Не совсем понимаю, если на странице присутствует элемент с 'blockid'. В этом случаи в код html страницы будет вставлено данное окно с css свойством display:none;. А при наведении курсора свойство удалится, так?

Share this post


Link to post
Share on other sites

Не цитируйте сообщения с кодом. Разве не видно что это превращает страницу в нечитаемую портянку? Нахрена цитировать все сообщение целиком, быстрым ответом пользоваться не можете?

 

Не совсем понимаю, если на странице присутствует элемент с 'blockid'.

Откуда понять, если даже толком не взглянули на код. Хотя два три раза посмотрите на пример и постарайтесь понять его логику работы.

Share this post


Link to post
Share on other sites

Спс, работает. Только вот по клику появляется окно, нельзя ли сделать так, чтобы при попадании курсора на элемент сплывала окно. И сворачивалось как только курсор сползет с элемента. :rolleyes:

Share this post


Link to post
Share on other sites

Вместо click используйте mouseover. Если окно не закрывается, закрывайте при потере наведения на элемент - mouseout.

 

if($('blockid')){
   var popup;
   $('blockid').observe('mouseover', function(e){
       Event.stop(e);

       popup = new ipb.Popup('popupid', { 
           type: 'pane',
           initial: 'Html content here',
           hideAtStart: false,
           w: '600px',
           h: 250
       });
   });
$('blockid').observe('mouseout', function(e){
	if(popup){
		popup.kill();
	}
});
}

  • Upvote 1

Share this post


Link to post
Share on other sites

Последний вопрос, дело в том, что на странице не один такой элемент, как выставить на классы?

 

$$('.blockid')...

 

Что та не выходит...

Share this post


Link to post
Share on other sites

Селектор $$ возвращает массив, следовательно нужно обходить каждый элемент в отдельности.

 

$$('.blockid').each(function(elem){ ... });

Share this post


Link to post
Share on other sites

А без обхождения не выйдет?

 

Я вот сейчас это кувыряю

 

ipb.delegate.register(".blockid", ipb.global.blockid );

 

не могу понять как это работает..?

Share this post


Link to post
Share on other sites
А без обхождения не выйдет?

Вам то какая разница?

 

 

не могу понять как это работает..?

/* IPB3 Delegation manager */

/* Simple class that allows us to specify css selectors and an associated function to run */

/* when an appropriate element is clicked */

  • Upvote 1

Share this post


Link to post
Share on other sites

Ну как какая разница, юзеру лишний раз браузер грузить не хочется...))

Share this post


Link to post
Share on other sites

Ну как какая разница, юзеру лишний раз браузер грузить не хочется...))

У вас так уж и много элементов которые переваливают за сотни?

Каким образом собираетесь вещать обработчик на элемент?

Если не ставить его непосредственно не элементы, нужно делегировать на их родительский блок. А если для них общий является только body? onmouseover это не onclick. Там и так хватает слушателей.

  • Upvote 1

Share this post


Link to post
Share on other sites

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

post-57319-0-98904000-1449911465_thumb.jpg

Edited by Testweb

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...