INVERSER
INVERSER
Powerful web-based technologies
Powerful web-based technologies

Нужен простой плагин для вкладок твоего сайта? Организуй их с помощью Coda Slider.

Это уникальное своего рода бесплатное расширение, которое можно встроить в страницы любого сайта или CMS. Всего-то необходимо подключить несколько библиотек, картинок и файлов стилей. Все, на этом все настройки закончились. Ты не поверишь, но это легче, чем кажется...

Если ты хочешь, чтобы твои новости, фотографии или какой-то контент сам листался и предлагал пользователю Купить или перейти по ссылке, то это лучше всего организовать с помощью предлагаемого компонента.

Что может быть проще? Тебе необходимо добавить на сайт 1 файл CSS, 1 изображение, 2 файла JS. Все это реализуется благодаря коду, который должен быть размещен head части исходного кода страницы.

$('#vkladki').codaSlider({
autoSlide:true,
autoHeight:false
});

где # vkladki — это идентификатор того контейнера, который будет использован для слайдшоу.

Настройки позволяют индивидуализировать этот плагин и сделать его уникальным для каждой страницы или сайта.

Нужно добавить также ява скрипты

<!--
Можно использовать постоянно обновляемые билиотеки для уменьешния ошибок и тп. но не рекомендуется

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
-->
<!-- Можно использовать библиотеки, но обязательно проверьте работоспособность -->
<script src="/./js/jquery-1.7.2.min.js"></script>
<script src="/./js/jquery-ui-1.8.20.custom.min.js"></script>

Также этот:

<!-- Эта библиотека ОБЯЗАТЕЛЬНА. Нельзя её убирать или изменять, перемещать в другие директории .-->
<script src="/./js/jquery.coda-slider-3.0.min.js"></script>

Теперь файл CSS:

<link rel="stylesheet" type="text/css" media="screen" href="/./css/coda-slider.css">

А сейчас просто создаем новый div с идентификатором и классом:

<div class="coda-slider"  id="vkladki">ЗДЕСЬ БУДУТ СЛАЙДЫ</div>

Сами слайды должны иметь заголовок H2 и класс title

<h2 class="title">1. Gimp</h2>
<div>Ну а здесь содержимое вкладок.</div>

Если пользователь нажимает на заголовок вкладки, то слайдшоу останавливается.

Не понятно? Открой исходный код демонстрации или спроси в комментариях. Всегда рад ответить и помочь.

Можно посмотреть какие именно функции есть и доступны для настройки в файле js\jquery.coda-slider-3.0.js

Coda Slider

Файлы Coda Slider:

Скачать Coda Slider оригинал
DEMO
Скачать Coda Slider измененный
DEMO

Добавить отзыв

Отзывов пока нет
Хостинг SSD, VPS, сервера
от 7.34$/365 дней
подробнее