ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Простой текстовый слайдер картинок на CSS

Простой текстовый слайдер картинок на CSS

Простой текстовый слайдер картинок на CSS
Как можно заметить, что слайдер стал неотъемлемой частью дизайн. Здесь идет текстовой аппарат, плюс к нему небольшое изображение. Что означает, то описание становится более актуальным, а вот картинка по правую сторону, она больше под ссылку сделана на переход на материал. Простой и удобный в установке, так как полностью настроен на стилях, что скриптов не нужно для работы.

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

Как пример, что DEMO посмотреть есть возможность.

Легкий слайдер контента с текстовой анимацией

Хотя вот эта рамка позволит редактировать по фиксации style="width: 53% вами заданной.

Как уже говорилось, на странице или в шапку подойдет.

Код
<table cellpadding="1" cellspacing="1" style="width: 53%;">
<tbody>
<tr>
<td>На протяжении многих лет эмуляция PlayStation 3 была противоречием. Уникальная архитектура процессора Cisco, известная как Cell Broadband Engine, принципиально отличается от любого другого процессора, который когда-либо выходил на рынок.</td>
  <td>
<link rel="stylesheet" href="http://zornet.ru/Aben/ABGEA/tuyruyy.css">  
<div id="container">
  <div id="content-slideshow">
  <div id="slideshow">
  <div id="mask">
  <ul>
  <li id="first" class="first-animation">
  <a href="http://zornet.ru/"> <img src="http://zornet.ru/Aben/ABGEA/1.jpg" alt="Картины для интерьера"> </a>
  </li>

  <li id="second" class="second-animation">
  <a href="http://zornet.ru/"> <img src="http://zornet.ru/Aben/ABGEA/2.jpg" alt="Картины для интерьера"> </a>
  </li>
   
  <li id="third" class="third-animation">
  <a href="http://zornet.ru/"> <img src="http://zornet.ru/Aben/ABGEA/3.jpg" alt="Картины для интерьера"> </a>
  </li>
  </ul>
  </div>
  </div>
  </div>
</div>
  </td>
</tr>
</tbody>
</table>

Как правило, размещать в соответствие тематике, что не исключаю под рекламный характер прописать.

Демонстрация
2017-10-16 Просмотров: 1637 Комментарий: (0)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарий: 0
avatar