Рекламный блок
Меню сайта
Вход на сайт
Мини-чат
Статистика
Пользователи
Гости сайта
Изменение логотипов с запоминанием на Cookies
 |
Добавил: Initro
Категория: Пользователи
Просмотров: 388
Скачек: 50
|
Скрипт представляет собой не большой код работающий с помощью jQuery и Cookies, суть скрипта в том что можно использовать на сайте большое кол-во логотипов, благодаря этому каждый пользователь может выбрать логотип который ему больше нравится.
И так приступим к установке:
1. Скачиваем архив прикрепленный к материалу.
2. Устанавливаем код после </head> для запуска нужных скриптов:
Code
<script type="text/javascript" src="/logo/js/cookie.js"></script>
<script type="text/javascript">
var img = ['/logo/img/1.png','/logo/img/2.png'];
$.getScript('/js/logo.js');
</script>
<script type="text/javascript">
var img = ['/logo/img/1.png','/logo/img/2.png'];
$.getScript('/js/logo.js');
</script>
Важно: Изображения нужно добавлять в масcив img таким образом: '/logo/img/1.png',. (У изображений должны быть наименования в виде цифр (1,2,3...), иначе скрипт не будет работать.)
4. Устанавливаем форму для выбору логотипов: (Устанавливаем код в любое место где хотим видеть форму.)
Code
<select id="logo_num">
<option value="0">Стандартная</option>
<option value="1">Новая шапка</option>
</select>
<input type="button" id="accept" value="Применить" />
<option value="0">Стандартная</option>
<option value="1">Новая шапка</option>
</select>
<input type="button" id="accept" value="Применить" />
Важно: При добавлении новой опции, не забываем указывать value, в правильной последовательности. (value="1,2,3..").
5. Выводим логотип: Ставим, данный код где будет логотип.
Code
<div id="logo"></div>
6. Создаем стиль в CSS:
Code
#logo {width: 100px; height: 50px; background: url('/logo/img/1.png');}
Важно: (Настраиваем размеры, и изображение основного логотипа.)
7. Скрипт успешно установлен, и готов к использованию.
Вот данный скрипт в работе: Демо
Скачать архив |
Теги материала:
Источник:
Данный материал еще никто не комментировал. Вы можете сделать это первым!
| Всего комментариев: 0 | |
