Как скрыть button up (JS) при определенной ширине экрана - Дизайн и модификация Invision Power Board

Перейти к содержимому

 

Правила раздела

Здесь обсуждаются вопросы оформления форумов IPB 3.x.
Пожалуйста, не оффтопьте, если зашли сюда случайно, и обратите внимание на соседние разделы.
Оформление форумов IPB 2.x.
Настройка форумов, включая установку и техническую настройку скинов.
Размещение рекламы на форумах.
SEO оптимизация форума.
Техническая поддержка наших скинов и модов.

СвернутьПрикрепленные теги

Теги не найдены

Страница 1 из 1
  • Вы не можете создавать новые темы
  • Вы не можете отвечать в этой теме

Как скрыть button up (JS) при определенной ширине экрана

#1 Пользователь не на сайте   kanv1s ответил: »

 
 
  • Member
  • **
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: Пользователи
  • Сообщений: 25
  • Регистрация: 07-Февраль 12
  • Репутация: 0
  • IPB version:4.1.x
 

Отправлено 11 Август 2015 - 02:19

Здравствуйте.

На форуме установлена "стрелка вверх", наподобие VK. Когда прокручиваешь форум вниз, она появляется слева, по всей длине экрана.
Все замечательно, удобно и всем нравится. Проблема вскрылась у пользователей планшетов и мобилок.
Стрелка перекрывает активные участки, что мешает отвечать в темах (просто читать форум, не мешает).
Стрелка работает на JS.

Вопрос следующий.
Можно ли в JS задать условие, что бы при определенной ширине экрана, стрелка просто не показывалась?

Вот код
jQuery(document).ready(function() {

	jQuery('body').append('<div class="button-up" style="display: none;opacity: 0.7;width: 40px;height:100%;position: fixed;left: 0px;top: 0px;cursor: pointer;text-align: center;line-height: 30px;font-size:20px;color: #d3dbe4;font-weight: bold;">↑</div>');
		
	jQuery (window).scroll (function () {
		if (jQuery (this).scrollTop () > 100) {
			jQuery ('.button-up').fadeIn();
		} else {
			jQuery ('.button-up').fadeOut();
		}
	});
	
	jQuery('.button-up').click(function(){
		jQuery('body,html').animate({
            scrollTop: 0
        }, 0);
        return false;
	});
	
	jQuery('.button-up').hover(function() {
			jQuery(this).animate({
				'opacity':'1',
			}).css({'background-color':'#fff','color':'rgb(136, 136, 136)'});
		}, function(){
			jQuery(this).animate({
				'opacity':'0.7'
			}).css({'background':'none','color':'#d3dbe4'});;
	});

});


Пытался скрыть ее, используя CSS (@media screen), но не получается. А в JS разбираюсь плохо.
0

#2 Пользователь на сайте   siv1987 ответил: »

 
 
  • Advanced
  • Insert nick to fast reply form
  • Quote selected text to fast reply form
  • Группа: IPB Skins Team
  • Сообщений: 8 725
  • Регистрация: 20-Март 09
  • Репутация: 2 271
  • IPB version:3.1.x
 

Отправлено 11 Август 2015 - 08:36

jQuery(document).ready(function() {

    if(jQuery(window).width() <= 650){
        return;
    }

1

Сообщить об этой теме:


Страница 1 из 1
  • Вы не можете создавать новые темы
  • Вы не можете отвечать в этой теме

1 пользователей читают эту тему
0 зарегистрированных, 1 гостей, 0 скрытых


Контактная информация

Вопросы по работе сайта

+7 (917) 501-4765
C 10 до 20 в рабочие дни (время московское)

Техническая поддержка

Контактные данные специалистов

Дизайн форумов

IPB 3.x ¦ IPB 2.x

Бесплатные шаблоны

IPB 3.2 – 3.4 ¦ IPB 3.1 ¦ IPB 3.0 ¦ IPB 2.2 – 2.3 ¦ IPB 2.1 ¦ Клипарт
Лицензия на использование ¦ Ваша поддержка ¦ О проекте
Copyright © 2005-2016 IPBSkins.ru Team
При копировании материалов с сайта
прямая ссылка на источник обязательна