1. Этот сайт использует файлы cookie. Продолжая пользоваться данным сайтом, Вы соглашаетесь на использование нами Ваших файлов cookie. Узнать больше.
  2. Внимание! Все изображения загружаются только на наш сервер! Для этого используйте кнопку «Прикрепить файлы» ниже или просто перетащите необходимые изображения со своего компьютера в окно редактора.

    Скрыть объявление
Скрыть объявление
Привет Гость! Рады вас видеть на нашем форуме. Вы видете это сообщение так как вы не зарегистрированы. Зарегистрируйтесь на нашем форуме и у Вас появятся дополнительные возможности.

Выдвижная панель (Шторка для радио)

Тема в разделе "Настройки AUGUST4U.RU", создана пользователем Ledi Sharm, 15 май 2020.

  1. Ledi Sharm Новичок

    Регистрация:
    15 май 2020
    Сообщения:
    18
    Симпатии:
    10
    Баллы:
    3
    Пол:
    Женский
    Добрый день! Хочу поделится выдвижной панелью для радио в чате хотя не только для радио ее можно использовать и как дополнительное меню. Долго искала по форумам но такую нигде не нашла. Может кому понадобится.
    Идем в HTML -шаблоны 1, далее кто в чате и на самый верх шаблона вставляем код:
    Код:
    <style type="text/css">
    .tm {
      float: left;
    }
    #title {
      background-position: center top;
      background-repeat: no-repeat;
    }
    </style>
    <div class="cm" style="position: fixed; top: -1000px; left: -1000px; user-select: none;"></div>
    
    <center>
    <style type="text/css">.verticalaccordion>ul {
     margin: 0;
     padding: 0;
     list-style:none;
     width: px;
    }
    .verticalaccordion>ul>li {
     display:block;
     overflow: hidden;
     margin: 0;
     padding:0;
     list-style:none;
     height:46px;
     width: 300px;
     /* Decorative CSS */
     background-color:#030000;
     /* CSS3 Transition Effect */
     transition: height 0.3s ease-in-out;
     -moz-transition: height 0.3s ease-in-out;
     -webkit-transition: height 0.3s ease-in-out;
     -o-transition: height 0.3s ease-in-out;
    }
    .verticalaccordion>ul>li>h3 {
     display:block;
     margin: 0;
     padding:10px;
     height:19px;
     /* Decorative CSS */
     border-top:#f0f0f0 1px solid;
     font-family: Arial, Helvetica, sans-serif;
     text-decoration:none;
     text-transform:uppercase;
     color: #000;
     background: #cccccc;
     /* CSS3 Gradient Effect */
     background: -moz-linear-gradient( top, #999999, #cccccc);
     background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#cccccc));
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff999999, endColorstr=#ffcccccc); /* IE 7 */
     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff999999, endColorstr=#ffcccccc)"; /* IE 8 */
    }
    .verticalaccordion>ul>li>div {
     margin:0;
     overflow:auto;
     padding:10px;
     height:350px
    }
    .verticalaccordion>ul>li:hover {
     height: 380px;
    }
    .verticalaccordion:hover>ul>li:hover>h3 {
     /* Decorative CSS */
     color:#fff;
     background: #000000;
     /* CSS3 Gradient Effect */
     background: -moz-linear-gradient( top, #454545, #000000); /* FF, Flock */
     background: -webkit-gradient(linear, left top, left bottom, from(#454545), to(#000000)); /* Safari, Chrome */
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000); /* IE 5.5 - IE 7 */
     -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000)"; /* IE 8 */
    }
    .verticalaccordion>ul>li>h3:hover {
     cursor:pointer;
    }
    </style>
    <center><div class="verticalaccordion">
    <ul>
    <li>
    <center><img src="https://c.radikal.ru/c18/2005/d0/8692ece2bfe2.gif" /><br><br></center>
    <center>
    Код вашего радио или что там еще хотите туда впихнуть)
    </div>
    </div>
    <br>
    
    Дальше смотрим и саму кнопку можем поменять на свою с любым названием, радио, доп.меню и т.д.
    Находим в коде :
    Код:
    <center><img src="https://c.radikal.ru/c18/2005/d0/8692ece2bfe2.gif" /><br><br></center>
    Где :
    Код:
    <img src="https://c.radikal.ru/c18/2005/d0/8692ece2bfe2.gif" />
    Меняем на свою ссылку с кнопкой залитую на любой хостинг изображений.
    Далее находим:
    Код:
    Код вашего радио или что там еще хотите туда впихнуть)
    Вместо этой фразы вставляем например код радио который хотите поставить в чат. 1, 2, 3, 4, сколько у вас радио.
    Если что то не понятно обращайтесь подскажу.
    Еще, забыла, эта панель удобна тем что ее можно сделать в длину на сколько вам хочется и позволяет шаблон кто в чате, находим в коде:
    Код:
    height:380px
    тут меняем 380 на нужную вам длину.
    От длинны зависит сколько кнопок вы поставите. Чем больше кнопок радио например тем больше должна быть длинна.
    Кнопка в свернутом виде:
    Снимок экрана 2020-05-16 в 8.25.40.jpg

    Кнопка в развернутом виде:
    Снимок экрана 2020-05-16 в 8.25.53.jpg
     
    Последнее редактирование: 12 июн 2020
    Любимая и Вадим47 нравится это.
  2. Вадим47 Новичок

    Регистрация:
    26 апр 2020
    Сообщения:
    1
    Симпатии:
    0
    Баллы:
    1
    Пол:
    Мужской
    Спасибо огромное за шторку на радио очень удобно !!! Поставил к себе в чат!!!
     
  3. Ledi Sharm Новичок

    Регистрация:
    15 май 2020
    Сообщения:
    18
    Симпатии:
    10
    Баллы:
    3
    Пол:
    Женский
    Рада что понадобилось.
     
  4. Александр Новичок

    Регистрация:
    8 июн 2020
    Сообщения:
    1
    Симпатии:
    0
    Баллы:
    1
    Пол:
    Мужской
    привет всем! у меня не получается больше 2х радио поставить
     
  5. Ledi Sharm Новичок

    Регистрация:
    15 май 2020
    Сообщения:
    18
    Симпатии:
    10
    Баллы:
    3
    Пол:
    Женский
    Добрый день! Это потому что нужно изменить параметры длинны шторки я писала там где код
    и меняйте длинну в зависимости от того сколько вы еще радио поставить хотите. если не получается скиньте сюда ссылку на ваш чат зайду помогу.
     
Здравствуйте! Кажется, вы используете AdBlockили другой блокировщик - могут быть недоступны некоторые функции сайта. Добавьте, пожалуйста, наш сайт в исключения. Спасибо за понимание!