Главная / Каталог скриптов для uCoz / Бесплатно, Вид материалов

Вид материалов в три колонки

Добавлено 09-12-2017 в 04:21

Категория Бесплатно, Вид материалов
Авторwaak
Просмотры1492
Комментарии6
Понравилось8

Здравствуйте! Сегодня публикую очередной вид материалов с адаптацией под моб устройства.
В данном виде материалов нет нечего лишнего только привью картинка название и блок под категорию или цену тут зависит от того что вам нужно

Вид материалов

Установка

В вид материалов нужного модуля ставим данный код

Код

<div id="wid_n_inf2">
  <div id="wid_n_inf2_cena">$OTHER1$</div>
  <div id="wid_n_inf2_img"><img src="$IMG_URL1$"></div>
  <div id="wid_n_inf2_nsme"><a href="$ENTRY_URL$">$TITLE$</a></div>
  </div>

Замените в коде выше вот эту строчку

Цитата

$OTHER1$

на тот код или текст который будет выводится в красном прямоугольнике.

Теперь в таблицу стилей подключим стили для нашего вида

Код

#wid_n_inf2 {
  position: relative;
  width: 29%;
  margin: 20px 2%;
  float: left;
}
#wid_n_inf2_cena {
  position: absolute;
  right: -15px;
  top: 15px;
  background: #D53A3A;
  color: #FFF;
  padding: 5px 10px;
}

#wid_n_inf2_img {
  min-width: 100%;
  height: 200px;
  overflow: hidden;
}
#wid_n_inf2_img img {
  min-width: 100%;
  max-width: 100%;
  height: 200px;
  object-fit: cover;
}

#wid_n_inf2_nsme {
  height: 50px;
  position: relative;
  margin-top: -50px;
  background: rgba(0,0,0,.7);
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
#wid_n_inf2_nsme:hover {
  background: rgba(127,177,30,.8);
}
#wid_n_inf2_nsme a {
  color: #FFF;
  display: block;
  font-family: Arial, Tahoma, sans-serif;
  font-size: 13px;
  padding: 10px 20px;
}

@media screen and (max-width: 1100px) {
  #wid_n_inf2 {width: 48%;margin: 1%;}
}
@media screen and (max-width: 600px) {
  #wid_n_inf2 {width: 96%;margin: 2%;}
}

Оставить комментарий

Добавлять комментарии могут только зарегистрированные пользователи.

Регистрация Вход

Создать сайт
Бесплатно

Меню

Полезно

Комментарии

pa patali2k

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

06-06-2025 в 05:58 материал

waak

на все страницы вывести можно скриптом через запрос на персональную страницу пользователя а на странице со списком закладок я вывел так

Код

У вас $NUM_ENTRIES$ заклад<?if($NUM_ENTRIES$%10=0||$NUM_ENTRIES$%10>4||$NUM_ENTRIES$%100>10&&$NUM_ENTRIES$%100<15)?>ок<?else?><?if($NUM_ENTRIES$%10=1)?>ка<?else?>ки<?endif?><?endif?>

05-06-2025 в 22:07 материал

pa patali2k

Добрый день! Waak подскажи как вы сделали У вас N закладок, у меня выходит 1-5 например, так если можете подскажите как вывести кол.во закладок пользователя например в мини профиль, чтоб кол.во закладок показывало на любой странице

04-06-2025 в 16:51 материал

pa patali2k

Добрый день!
Сегодня снова попробовал установить скрипт и он снова не заработал, все перерыл, изменял, убирал и никак не заводился.
Решение: В общих настройках сайта нужно переключить Версия библиотеки jQuery: на jquery-1.12.4.min.js
В общем теперь просьба, не могли бы переписать скрипт закладок под jquery-3.6.0.min.js