Перейти к содержимому
Открыть в приложении

Удобный способ просмотра. Узнать больше.

Дизайн и модификация Invision Community

Полноэкранное приложение на главном экране с push-уведомлениями, медалями и многим другим.

Чтобы установить это приложение на iOS и iPadOS
  1. Нажмите иконку «Поделиться» в Safari
  2. Прокрутите меню и нажмите На экран «Домой».
  3. Нажмите Добавить в правом верхнем углу.
Чтобы установить это приложение на Android
  1. Нажмите меню из трёх точек (⋮) в правом верхнем углу браузера.
  2. Нажмите Добавить на главный экран или Установить приложение.
  3. Подтвердите, нажав Установить.
Русский язык для Invision Community 5

lightbox для 3.1.4

Заметил что в версии IPB 3.4 все изображения открываются в lightbox. Тогда как в 3.1.4 в lightbox открываются лишь приаттаченные изображения.

Возможно ли это как то пофиксить?

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

Если речь о инлайн изображений то в 3.4 изображения находятся внутри спана

Парсится ббкод в \admin\sources\classes\bbcode\custom\defaults.php, строка

 

return "<img src='{$content}' alt='{$this->lang->words['bbcode_img_alt']}' class='bbc_img' />";

  • Автор

Если речь о инлайн изображений то в 3.4 изображения находятся внутри спана <span rel='lightbox'><img src...></span>

Парсится ббкодв в \admin\sources\classes\bbcode\custom\defaults.php, строка

Ура получилось! Спасибо. Пока тестирую, о результатах скажу позднее.

  • Автор

Всё бы хорошо, но есть несколько нюансов.

 

1. Как сделать листинг изображений? То есть листинг всех изображений что есть в сообщении. Такое есть у приатаченных изображений.

2. У приатаченных изображениях есть кнопка Сохранить (открывает изображения в новой вкладке), а у остальных нет :(

3. И самое важное - если изображение-превью, то нажимая на него, сразу картинка превью, то есть картинка в ссылке не срабатывает.

Как сделать листинг изображений? То есть листинг всех изображений что есть в сообщении. Такое есть у приатаченных изображений.

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

 

3. И самое важное - если изображение-превью, то нажимая на него, сразу картинка превью, то есть картинка в ссылке не срабатывает.

Лайтбокс перехватывает событие, поэтому переход по ссылке не сработает. В 3.4 он не добавляется к изображениям в ссылках, но там другой парсер.

 

Самый простой вариант добавить lightbox через js, парсер форума 3.1 не имеет должного функционала.

Добавить в конце шаблона Темы -> topicViewTemplate

 

<script type='text/javascript'>
$$('.post_block').each(function(elem){
var pid = elem.readAttribute('id').replace('post_id_', '');
elem.select('img.bbc_img').each(function(img){
	var parent = img.up();
	if(parent.tagName.toLowerCase() == 'a'){
		if(/\.(jpe?g|gif|png|bmp)$/.test(parent.href)){
			parent.writeAttribute('rel', 'lightbox['+pid+'] ' + parent.readAttribute('rel').replace('external'));
		}
	}
	else{
		var a = new Element('a', {'rel': 'lightbox['+pid+']', 'href' : img.getAttribute('src')});
		img.wrap(a);
	}
});
});
</script>

Принцип скрипта следующий:

- если изображение находиться внутри ссылки, к rel ссылке добавляется значение lightbox

- если родительский элемент не является ссылкой, для изображение создается обертка из ссылки с адресом изображения и атрибутом rel lightbox.

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

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

ПС.

Старую правку нужно удалить и сбросить кеш сообщений.

  • Автор

Самый простой вариант добавить lightbox через js, парсер форума 3.1 не имеет должного функционала.

Добавить в конце шаблона Темы -> topicViewTemplate

Кнопка Сохранить и листинг появился, супер. А вот проблема с изображениями в ссылке так и осталась :(

И ещё после этого скрипта новая проблема появилась - изображения которые в спойлере не показываются, то есть попап-окно пояаляется, но изображения нет.

Вот пример

[url=http://imtw.ru/uploads/imperiall/load/load1479760397_123-11_battle_of_wenzenbach.jpg][img=http://imtw.ru/uploads/imperiall/load/min_load1479760397_123-11_battle_of_wenzenbach.jpg][/url]

И ещё после этого скрипта новая проблема появилась - изображения которые в спойлере не показываются, то есть попап-окно пояаляется, но изображения нет.

Потому что у вас изображения в спойлере не имеют атрибута src, он создается при открытие спойлера из data-src.

img.getAttribute('src') заменить на img.getAttribute('data-src') || img.getAttribute('src')

  • Автор

Потому что у вас изображения в спойлере не имеют атрибута src, а создается он при открытие спойлера из data-src.

img.getAttribute('src') заменить на img.getAttribute('data-src') || img.getAttribute('src')

Там нет img.getAttribute('src') а есть getAttribute('src')

 

Вот ваш код из

Вот ваш код из

Заменить в коде выше.

  • Автор

Заменить в коде выше.

Не понял.

  • Автор

Обновил скрипт для topicViewTemplate, заменил img.getAttribute('src') на img.getAttribute('data-src') || img.getAttribute('src') в файле, сбросил кеш - в спойлерах так и не появилось :(

в спойлерах так и не появилось

Я тестировал и скрипт создает ссылку-врапер как положено.

  • Автор

Я тестировал и скрипт создает ссылку-врапер как положено.

А может надо что то изменить в шаблоне include_lightbox_real?

  • Автор

Всё оказалось просто.

var a = new Element('a', {'rel': 'lightbox['+pid+']', 'href' : img.getAttribute('src')}); надо было заменить на var a = new Element('a', {'rel': 'lightbox['+pid+']', 'href' : img.getAttribute('src') || img.getAttribute('data-src')});

  • Автор

Правда превью так и не исправлена.

Решил сделать так:

a.bbc_url .bbc_img {margin: 0px -2px 50px -2px;}  a.bbc_url:hover .bbc_img {margin: 0px -2px 50px -2px;} 

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

imp1481634608_2016-12-13_150753.jpg

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

Аккаунт

Навигация

Поиск

Поиск

Настроить push-уведомления браузера

Chrome (Android)
  1. Нажмите на иконку замка рядом с адресной строкой.
  2. Нажмите Права доступа -> Уведомления.
  3. Измените свои настройки.
Chrome (компьютер)
  1. Нажмите на иконку замка в адресной строке.
  2. Выберите Настройки сайта.
  3. Найдите Уведомления и измените свои настройки.