Перейти к публикации
Дизайн и модификация IPS Community IPBSkinsBETA
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...
Strategius

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

Рекомендованные сообщения

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

 

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

 

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

 

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

Поделиться сообщением


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

Поделиться сообщением


Ссылка на сообщение

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

Поделиться сообщением


Ссылка на сообщение

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

Поделиться сообщением


Ссылка на сообщение
А решение вообще возможно найти, или это в принципе невозможно, прописано глубоко в скриптах

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

Поделиться сообщением


Ссылка на сообщение

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

Поделиться сообщением


Ссылка на сообщение

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

public/js/ipb.js

  • Upvote 1

Поделиться сообщением


Ссылка на сообщение

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

 

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

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

Поделиться сообщением


Ссылка на сообщение

Сейчас окно закрывается по нажатию на кнопку, к которой присвоен класс "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

Поделиться сообщением


Ссылка на сообщение
08/09/17 10:03 (изменено)

нужно будет добавить 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) });

Изменено пользователем Strategius

Поделиться сообщением


Ссылка на сообщение

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

Я же написал

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

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

Поделиться сообщением


Ссылка на сообщение
08/09/17 10:17 (изменено)
Вы это сделали?

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

 

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

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

 

} else {

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

Изменено пользователем Strategius

Поделиться сообщением


Ссылка на сообщение

нужно будет посмотреть функции 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

Поделиться сообщением


Ссылка на сообщение

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

Поделиться сообщением


Ссылка на сообщение

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...