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

Закрытие модальных окон

Recommended Posts

Добрый день. Подскажите, пожалуйста, можно ли сделать так, чтобы модальные окна (к примеру окно входа) закрывались не только по нажатию на крестик в углу окна, но и просто по тапу на любое место экрана, как это сделано в popup-окнах?

 

А то не очень удобно каждый раз тыкать в эту маленькую кнопку, хотелось бы закрывать его наугад.

 

Никто не подскажет? :( В DLE насколько понял, такая же проблема, человек подсказал, что нужно скрипт дополнить, но какой и где...

 

Неужели не реализуемо?

Share this post


Link to post
Share on other sites
1. Форум является некоммерческой составляющей проекта IPBSkins.ru. Вся помощь, которая здесь оказывается, добровольна и бесплатна. Не забывайте, что мы тратим свое свободное время. Будьте терпеливы, ожидая ответа. Если ответ не получен, "апать" тему с вопросом разрешается не ранее, чем через два дня после ее создания.
  • Upvote 1

Share this post


Link to post
Share on other sites

А не подскажете хоть примерно, где копать, пожалуйста? Вроде это где-то в js-скриптах прописано?

Share this post


Link to post
Share on other sites

А решение вообще возможно найти, или это в принципе невозможно, прописано глубоко в скриптах? Просто довольно неудобно закрывать модальные окна, каждый раз нажимая на маленькую кнопку в углу, хотелось бы, чтобы они закрывались как popup - просто при тапе на экран...

Share this post


Link to post
Share on other sites
А решение вообще возможно найти, или это в принципе невозможно, прописано глубоко в скриптах

Ничего невозможного в принципе нет. Ищите если нечего делать, скрипты форума расположены в папке /public/js/.

Share this post


Link to post
Share on other sites

Не получается найти этот момент :( А не подскажете приблизительно, в каком файле находится ответственный за это код?

Share this post


Link to post
Share on other sites

А не подскажете приблизительно, в каком файле находится ответственный за это код?

public/js/ipb.js

  • Upvote 1

Share this post


Link to post
Share on other sites

Нашел там такой код:

 

this.closeLink = new Element('div', { 'id': this.id + '_close' } ).addClassName('popupClose').addClassName('clickable');

Сейчас окно закрывается по нажатию на кнопку, к которой присвоен класс "popupClose". Не подскажете, пожалуйста, как сюда же добавить закрытие по клику мышкой по экрану?

Share this post


Link to post
Share on other sites

Сейчас окно закрывается по нажатию на кнопку, к которой присвоен класс "popupClose". Не подскажете, пожалуйста, как сюда же добавить закрытие по клику мышкой по экрану?

 

Разбирайтесь :)

Дам подсказки.

Если popup-окно не модальное, то его можно закрывать, кликнув вне области окна.

		if( this.options.modal == false ){
		new Effect.Appear( $( this.wrapper ), { duration: 0.3, afterFinish: function(){
			if( Object.isFunction( this.callbacks['afterShow'] ) )
			{
				this.callbacks['afterShow']( this );
			}
		}.bind(this) } );
		this.document_event = this.handleDocumentClick.bindAsEventListener(this);
		this.setDocumentEvent();
	} else {
		new Effect.Appear( $('document_modal'), { duration: 0.3, to: this.options.modalOpacity, afterFinish: function(){
			new Effect.Appear( $( this.wrapper ), { duration: 0.4, afterFinish: function(){
				if( Object.isFunction( this.callbacks['afterShow'] ) )
				{
					this.callbacks['afterShow']( this );
				}
		 	}.bind(this) } );
		}.bind(this) });
	}

Строки

			this.document_event = this.handleDocumentClick.bindAsEventListener(this);
		this.setDocumentEvent();

То есть Вам нужно будет посмотреть функции handleDocumentClick и setDocumentEvent и определить при каких условиях/параметрах окно скрывается. Там по паре строк кода.

Естественно нужно будет добавить 2 строки в else, либо вынести из if

  • Upvote 1

Share this post


Link to post
Share on other sites

нужно будет добавить 2 строки в else, либо вынести из if

Т.е. эти 2 строки отвечают за скрытие окна при нажатии вне его области?

 

Я добавил их в функцию document_modal, но все равно закрывается только по нажатию на крестик...

 

new Effect.Appear( $('document_modal'), { duration: 0.0, to: this.options.modalOpacity, afterFinish: function(){
			new Effect.Appear( $( this.wrapper ), { duration: 0.0, afterFinish: function(){
				if( Object.isFunction( this.callbacks['afterShow'] ) )
				{
					this.callbacks['afterShow']( this );
				}
		 	}.bind(this) } );
			this.document_event = this.handleDocumentClick.bindAsEventListener(this);
		        this.setDocumentEvent();
		}.bind(this) });

Edited by Strategius

Share this post


Link to post
Share on other sites

Я добавил их в функцию document_modal, но все равно закрывается только по нажатию на крестик...

Я же написал

нужно будет посмотреть функции handleDocumentClick и setDocumentEvent и определить при каких условиях/параметрах окно скрывается.

Вы это сделали?

Share this post


Link to post
Share on other sites
Вы это сделали?

Да, конечно. Скрытие выполняется при условии, что окно не модальное:

 

if( this.options.modal == false ){

В противном случае скрытие выполняться не будет

 

} else {

Что я не так делаю? :(

Edited by Strategius

Share this post


Link to post
Share on other sites

нужно будет посмотреть функции handleDocumentClick

	handleDocumentClick: function(e)
{
	Debug.write( 'document click: ' + Event.element(e).id);

	if( !Event.element(e).descendantOf( this.wrapper ) && ( this.options.attach && ( Event.element(e).id != this.options.attach.target.id ) ) )
	{
		this.hide(e);
	}
},

Вариант

if( !Event.element(e).descendantOf( this.wrapper ) && ( this.options.attach && ( Event.element(e).id != this.options.attach.target.id ) ) )

заменить на

if( !Event.element(e).descendantOf( this.wrapper ) && ( this.options.modal || ( this.options.attach && ( Event.element(e).id != this.options.attach.target.id ) )) )

  • Upvote 1

Share this post


Link to post
Share on other sites

Теперь заработало! Огромное Вам спасибо, выручили, что бы без Вас делал! 046.gif

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