Скрыть контент для мобильных и планшетов

[chatka]

Где-то на форуме видел код, который позволяет скрыть контент, когда форум просматривают на мобильных телефонах и планшетах.

Вот только перерыл уже практически весь форум, не могу найти…

[chatka]

Или разный код для десктопа и мобильных...

[Respected]

Какой конкретно контент нужно скрыть?

[DeathVice1998]

2 минуты назад, Respected сказал:

Какой конкретно контент нужно скрыть?

на Мафии кнопка "Вверх" на телефоне не отображается. Как скрыть? 

[Respected]

@media screen and (max-width: 767px) {

.class {display:none}

}

[chatka]

3 минуты назад, Respected сказал:

Какой конкретно контент нужно скрыть?

Нужно скрыть, или наоборот — показать текст, рекламу от Яши и Гоши.

Для рекламы — желательно показывать разные объявления для показа на компьютере и мобильном с планшетом.

Как-то так.

[Respected]

Можно адаптивный блок рекламы поставить.

[DeathVice1998]

21 минут назад, Respected сказал:

@media screen and (max-width: 767px) {

.class {display:none}

}

Спасибо большое!

[chatka]

6 минут назад, Respected сказал:

Можно адаптивный блок рекламы поставить.

Да.  Гугл в этом плане молодец, а вот Яндекс еще не дорос, к сожалению. И у последнего хочется уменьшить количество объявлений для мобильных.

Но нужно еще и скрыть некоторые объявления для форумов.

Использую, в том числе:

<div class="ipsMessage ipsMessage_info">Текст</div>
<div class="ipsMessage ipsMessage_error">Текст</div>
<div class="ipsMessage ipsMessage_warning">Текст</div>
<div class="ipsMessage ipsMessage_success">Текст</div>

 

[Respected]

Тогда пой пост выше вполне подойдёт

[chatka]

Ага, большое спасибо! Скрою этим кодом не нужное.

Еще бы найти код или мод (плагин) для раздельного показа.

Короче, покопался и понял, что если уж сильно прижмет, нужно копать в сторону правил @media

[IAF]

А чем классы .ipsResponsive_hidePhone, .ipsResponsive_hideTablet и .ipsResponsive_hideDesktop, а так же .ipsResponsive_showPhone, .ipsResponsive_showTablet и ipsResponsive_showDesktop не подходят? Всё то же самое, но используя фреймворк IPS.

[chatka]

Ага, то есть нужно вот так:

<div class=".ipsResponsive_hidePhone">Текст</div>

И так далее...

Правильно?

[IAF]

2 часа назад, chatka сказал:

Ага, то есть нужно вот так:

<div class=".ipsResponsive_hidePhone">Текст</div>

И так далее...

Правильно?

В html точки не пишутся перед названием класса.

Они пишутся в CSS при задании стилей для класса.

Т.е:

<div class="ipsResponsive_hidePhone">Текст</div>

 

[chatka]

IAF, да, конечно, поторопился.

Спасибо большое именно это я и искал!

[SkiFteL]

А можно как нить сочетать 2 класса!?
К примеру я хочу чтобы блок небыл виден с ПК и с телефона (тоесть виден тока на планшете!?
Как правильно класс прописать!?)

Не правильно?

<div class="ipsResponsive_hidePhone.ipsResponsive_hideDesktop">Текст</div>

Просто у меня стоит уже вывод информации (2 блока):
1. Показывать только на ПК
2. Показывать только на мобилке

Хочу сделать еще блок "Только на планшетах" чтобы он не пересекался с блоком телефона...

[WOLF]

5 минут назад, SkiFteL сказал:

А можно как нить сочетать 2 класса!?
К примеру я хочу чтобы блок небыл виден с ПК и с телефона (тоесть виден тока на планшете!?
Как правильно класс прописать!?)

Не правильно?

<div class="ipsResponsive_hidePhone.ipsResponsive_hideDesktop">Текст</div>

Просто у меня стоит уже вывод информации (2 блока):
1. Показывать только на ПК
2. Показывать только на мобилке

Хочу сделать еще блок "Только на планшетах" чтобы он не пересекался с блоком телефона...

все намного проще:

http://htmlbook.ru/css/value/media

 

[SkiFteL]

1 минуту назад, WOLF сказал:

все намного проще:

http://htmlbook.ru/css/value/media

 

Простите но я не силен в том что вы скинули)))
Просто у меня в блоке виджета стоит уже:
1. Вывод инфы, чтобы показывало только на ПК
2. Вывод инфы, чтобы показывало только на мобиле

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

[WOLF]

Только что, SkiFteL сказал:

Простите но я не силен в том что вы скинули)))
Просто у меня в блоке виджета стоит уже:
1. Вывод инфы, чтобы показывало только на ПК
2. Вывод инфы, чтобы показывало только на мобиле

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

причем тут силен или нет, ты для начала прочти все что там написано, а не бегло глазами пробеги.

у планшетов +\- своя ширина экрана ее и задаешь через медиа, прописав класс в css 

[ipb323]

Подниму тему. Через css удобно скрывать, но если это тяжёлый контент, то он только скрывается, но всё равно загружается. Можно в шаблоне условие сделать, что если это мобильная версия (или ширина экрана меньше определенной величины), то не загружать блок?

[siv1987]

В шаблоне можно только по юзерагенту. Ширина экрана там не доступна.

[ipb323]

22 минуты назад, siv1987 сказал:

В шаблоне можно только по юзерагенту. Ширина экрана там не доступна.

Нашёл решение.

Может кому понадобится:

Если ширина больше 900 пикселей то выводится код.

<script>
if(window.screen.width > 900) {
    document.write("код");
                               }
</script>

 

[SkiFteL]

Тема устарела но все же!
Как вывести определенный код при помощи данных функций, только на главной странице сайта и на ПК?
Это понятно: Я спрятал для мобильных устройств. А как быть с выводом только на главной странице сайта? Или скрыть на определённых страницах...

<div class="ipsResponsive_hidePhone">Текст</div>

Изменено 28 марта, 2022 пользователем SkiFteL

[SlawkA]

41 минуту назад, SkiFteL сказал:

Тема устарела но все же!
Как вывести определенный код при помощи данных функций, только на главной странице сайта и на ПК?
Это понятно: Я спрятал для мобильных устройств. А как быть с выводом только на главной странице сайта? Или скрыть на определённых страницах...

<div class="ipsResponsive_hidePhone">Текст</div>

либо я понял что ты ответил же на свой вопрос сам. либо я вообще ничего не понял. 🙄

[SkiFteL]

14 минут назад, SlawkA сказал:

либо я понял что ты ответил же на свой вопрос сам. либо я вообще ничего не понял. 🙄

ipsResponsive_hidePhone - это скрывает на моб.устройствах

А мне надо чтобы блок показывался только на главной странице!...
Или же показывался на определенных страницах
Есть ли такой код?