Слайдеры

Простой слайдер на jQuery с навигацией

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

Чаще всего в слайдерах я вывожу основные направления, которыми занимается компания. Но сейчас не об этом. Хочу представить вашему вниманию очень простой jQuery слайдер, который я сильно усовершенствовал.

Возможности слайдера:

  1. Можно менять время перелистывания слайдов.
  2. Можно отображать или скрывать стрелки навигации для перелистывания слайдов.
  3. Можно отключать/включать пагинацию слайдов снизу.
  4. Слайдер полностью адаптивный - может легко растягиваться на 100% экрана или div-а, в который вы можете его поместить.
  5. В самих слайдах вы можете писать любой контент - например, ссылки, картинки, текстовую информацию.
  6. Вместо картинки в слайдер можно вставить видео, например с youTuba.

Из преимуществ хочу отметить простоту установки и качество кода - он работал практически на всех сайтах, где бы я его не разместил. В скачанном архиве вы увидите 4 вида подключаемых  слайда - с обычной подписью, с сложной подписью, видео, и обычную картинку. Думаю, из этих примеров будет очень легко понять, как добавлять нужные вам виды слайдов. 

Что касается css, то его также настолько мало, что править вам придется только первые 4 строчки, чтобы подстроить размер jQuery слайдера под свой сайт.

 

Diapo слайдер на jQuery для вашего сайта

Организовать слайдшоу на своем сайте не так сложно, как кажется, особенно если правильно подобрать для этих целей функциональный слайдер, каким и является скрипт сделанный на библиотеке diapo.js. Читать далее «Diapo слайдер на jQuery для вашего сайта»

Фотогалерея-слайдер Touch.jquery.js для сайта

Данная фотогалерея интересна тем, что позволяет выводить фотографии общим списком, например в виде миниатюр, при нажатии на которые происходит открытие полноценного слайдера, где все фотографии можно посмотреть подробнее. Читать далее «Фотогалерея-слайдер Touch.jquery.js для сайта»