Правила форума Подписки Ленточный
Статистика Форума
Последние обновленные темы Самые популярные темы Самые активные Новые участники
True Stalker (0)
Ловец снов (ОБТ) (0)
Контракт: Выходец с того ... (0)
Prosectors Project 1.7 (0)
Тайна Кордона (0)
У костра (193)
Анекдоты (145)
Города (94)
Обновления сайта (77)
Свалка (68)
StraNNik (1417)
RamzeS (513)
Каратель (170)
Narkostalker (121)
Кракен (93)
p4ladya (05.02.2024)
alexander24tomilin (20.12.2023)
Lesnik (13.12.2023)
nikbal888 (05.12.2023)
Fugaz56 (09.08.2023)
  • Страница 1 из 1
  • 1
Форум [HoC] | Развлекательный форум » Мастерская портала » Скрипты » Разное » Web-социальные кнопки с приятной анимацией (Rip by Бармен)
Web-социальные кнопки с приятной анимацией
Слышу гимн зашитых ртов
StraNNik
Группа: Администратор
Ранг: Опытный
Сообщений: 1417
Карма: 33
Сообщение # 1
Дата: 11.04.2019 в 16:49


[tealtable]Рипал: Бармен[/tealtable]
[kortable]Ссылка на скачивание![/kortable]
Вставляем в Нижнею часть сайта:

Код
<div class="cont">
   <div class="block_title">Еще больше интересного, <b>в моих соцсетях</b></div>
   <div class="grid">
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc1.jpg" alt="">
      </a>
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc2.jpg" alt="">
      </a>
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc3.jpg" alt="">
      </a>
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc4.jpg" alt="">
      </a>
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc5.jpg" alt="">
      </a>
      <a href="#" target="_blank" rel="noopener" class="item">
      <img src="/images/ic_soc6.jpg" alt="">
      </a>
   </div>
</div>

CSS:

Код
@import url('https://fonts.googleapis.com/css?family=Lobster&subset=cyrillic,cyrillic-ext');
@import url('https://fonts.googleapis.com/css?family=Comfortaa&subset=cyrillic,cyrillic-ext');
.cont {
     position: relative;
     width: 100%;
     max-width: 1200px;
     margin: 0 auto;
     padding: 0 15px;
}
.block_title {
     color: #1b1b1b;
     font-size: 54px;
     font-family: 'Lobster', cursive;
     position: relative;
     margin-bottom: 70px;
     padding: 0 10px;
     letter-spacing: .02em;
}
.block_title:after {
     position: absolute;
     bottom: -28px;
     left: 0;
     display: block;
     width: 103px;
     height: 8px;
     content: '';
     background: url(/images/bg_block_title.png) 0 0 no-repeat;
}
.block_title b {
     font-family: 'Comfortaa', cursive;
     font-style: normal;
}
.grid {
     display: flex;
     margin-bottom: -30px;
     margin-left: -30px;
     justify-content: flex-start;
     align-items: stretch;
     align-content: flex-start;
     flex-wrap: wrap;
}
.grid .item {
     position: relative;
     top: 0;
     display: block;
     width: calc(16.666% - 30px);
     margin-bottom: 30px;
     margin-left: 30px;
     transition: .2s linear;
     box-shadow: 0 5px 32px rgba(77,112,219,.29);
}
.grid .item:hover {
     top: -18px;
     box-shadow: 0 13px 21px rgba(0,111,252,.52);
}
.grid .item img {
     display: block;
     width: 100%;
}

Форум [HoC] | Развлекательный форум » Мастерская портала » Скрипты » Разное » Web-социальные кнопки с приятной анимацией (Rip by Бармен)
  • Страница 1 из 1
  • 1
Поиск:

Авторское право на игру и использованные в ней материалы принадлежат GSC Game World.
Любое использование материалов сайта возможно только с разрешения его администрации!
Для корректного отображения сайта, рекомендуем использовать обновленный Microsoft Edge
Powered by StraNNik | Хостинг от uCoz | Рекомендуем AdGuard
© 20.11.2013-13.04.2024