Автор Тема: Установка баннера в шапке, чтоб он показывался только в разрешении на пк  (Прочитано 109 раз)

0 Пользователей и 1 Гость просматривают эту тему.

alex29Автор темы

  • *
  • Оффлайн
  • Награды На форуме более 1 года
  • Дата регистрации: Апр. 2018
  • Сообщений: 3
  • Страна: ru
  • Репутация +0/-0
  • Пол: Мужской
    • Награды
Добрый вечер уважаемые форумчане. Подскажите пожалуйста как правильно прописать баннер от линкслота в шапке чтоб он отображался только на мониторах с большим изображением а на телефоне скрывался. Скрипт шапки  прилагаю.
вот сам код линкслота  баннер размером 468х60 <div id="linkslot_262442"><script src="https://linkslot.ru/bancode.php?id=262442" async></script></div>
<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title><?=$_title; ?> | <?=NAME; ?></title>
    <link rel="SHORTCUT ICON" type="image/png" href="/assets/images/favicon.png">
    <link href="/assets/styles/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/assets/styles/app.css" rel="stylesheet">
    <link href="/assets/plugins/bootstrap-sweetalert/sweet-alert.css" rel="stylesheet" type="text/css">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  </head>

  <body class="page">
    <div class="header">
      <div class="header__row container">
        <div class="row">
          <div class="col-md-5 col-xs-12 col-sm-12">
            <div class="logo" style="min-height:32px;">
              <a href="/" class="logo__link">
                <img src="/assets/images/logo.png" class="logo__icon">
              </a>
            </div>
          </div>
          <div class="header__contact col-md-7 col-xs-12 col-sm-12">

          <?php if (!$this->usid) : ?>

            <a class="btn header__callback" href="/login">
              <span class="btn__text">Вход в аккаунт</span>
            </a>

          <?php else : ?>

            <a class="btn header__callback" href="/cabinet">
              <span class="btn__text">Мой кабинет</span>
            </a>

          <?php endif; ?>

          </div>
        </div>
      </div>
      <div class="nav">
        <div class="nav__btn-wrap">
          <button class="btn nav__btn" type="button">
            <span class="btn__text">
              <span class="nav__icon"></span>
            </span>
          </button>
        </div>
      
        <div class="nav__body container">
          <div class="nav__inner">
            <div class="nav__close"></div>
            <ul class="nav__list">
              <li class="nav__item"><a href="/" class="nav__link">Главная</a></li>
              <li class="nav__item"><a href="/about" class="nav__link">О проекте</a></li>
              <li class="nav__item"><a href="/stats" class="nav__link">Статистика</a></li>
              <li class="nav__item"><a href="/guarantee" class="nav__link">Гарантии</a></li>
              <li class="nav__item"><a href="/competitions" class="nav__link">Конкурсы</a></li>
              <li class="nav__item"><a href="/feedback" class="nav__link">Отзывы</a></li>
              <li class="nav__item"><a href="/contacts" class="nav__link">Контакты</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
 

GameRussia

  • *
  • *
  • Оффлайн
  • Награды Более 200 сообщений Более 2 лет на форуме Репутация более 5 За помощь пользователям Более 10 созданных тем
  • Дата регистрации: Июнь 2017
  • Сообщений: 205
  • Страна: ru
  • Поблагодарили: 20 раз(а)
  • Репутация +8/-0
  • Пол: Мужской
    • Награды
  • Социальные сети:
    ВКонтакте
Вариантов много. Css @media, js по ширине экрана
//чистый js

document.addEventListener("DOMContentLoaded", function(event)
{
    window.onresize = function() {
        resize_info();
    };
});
 
function resize_info()
{
    var width = $(window).width();
    if(width < 640){
       document.getElementById('id_bloka').style.visibility = "hidden";
    }else{
       document.getElementById('id_bloka').style.visibility = "visible";
    }
}

//jQuery
$( window ).resize(function() {
        var width = $(window).width();
          if(width < 640){
             $('#id_bloka').hide();
          }else{
             $('#id_bloka').show();
          }
    });
js определение устройства
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
    // код для мобильных устройств
    //чистый js
    document.getElementById('id_bloka').style.visibility = "hidden";
    //вариант с jQuery
    $('#id_bloka').hide();
  } else {
    // код для обычных устройств
    //чистый js
    document.getElementById('id_bloka').style.visibility = "visible";
    //вариант с jQuery
    $('#id_bloka').show();
}
 
Теги:
 

При установке SSL исчезает весь дизайн

Автор NatixРаздел Вопросы по настройке фруктовых ферм

Ответов: 1
Просмотров: 667
Последний ответ 24 Декабря 2016, 19:00:40
от romcka8
Инструкция по установке модуля Tоп

Автор SomnambulaРаздел Вопросы по модулям фруктовых ферм

Ответов: 21
Просмотров: 1137
Последний ответ 04 Июня 2017, 18:07:26
от shans5
Установка скрипта на хост

Автор MrMooNРаздел Общие вопросы по фермам

Ответов: 6
Просмотров: 647
Последний ответ 17 Августа 2017, 11:35:08
от MrMooN
Установка лимита на сёрфинг

Автор doktor540Раздел Вопросы по модулям фруктовых ферм

Ответов: 1
Просмотров: 108
Последний ответ 04 Июня 2019, 16:01:19
от sopik909
Установка FreeKassa

Автор SumBoyРаздел Вопросы по модулям фруктовых ферм

Ответов: 8
Просмотров: 2385
Последний ответ 07 Августа 2016, 17:09:43
от radga14