Главная :: Регистрация :: Вход :: RSS
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Вопросы по дизайну, управлению и настройки модулей СMS от uCoz! » СКРИПТЫ » Модуль Поиск по Сайту » Выбор типа поиска по сайту с запоминанием через локальное хр (Выбор типа поиска по сайту с запоминанием через локальное хр)
Выбор типа поиска по сайту с запоминанием через локальное хр
penokyДата: Суббота, 07.03.2015, 09:28 | Сообщение # 1
Генерал-майор
Группа: Администраторы
Сообщений: 279
Репутация: 0
Статус: Offline
Выбор типа поиска по сайту с запоминанием через локальное хранилище для uCoz





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

Установка:

В самый низ вашего css вставляйте:

Код
.searchSbmFl,.apomainsearch,.apomodulesearch {  
display:none;  
}  

.queryField {  
border: none;  
margin-bottom: 5px;  
border-top: 1px solid #ccc;  
border-left: 1px solid #ccc;  
border-bottom: 1px solid #eee;  
border-right: 1px solid #eee;  
padding:3px  
}  

.apomainsearchok,.apomodulesearchok,.apomainsearchico,.apomodulesearchico {  
height: 15px;  
position: absolute;  
margin-top: 2px;  
margin-left: -17px;  
}  
.apomainsearchico,.apomodulesearchico {  
margin-left:3px;  
}


В вашем шаблоне найдите $SEARCH_FORM$ или $MODULE_SEARCH_FORM$ и замените на:

Код
<div class="apomainsearch">  
$SEARCH_FORM$  
</div>  
<div class="apomodulesearch">  
$MODULE_SEARCH_FORM$  
</div>  

<script>  
// Возможность выбирать тип поиска by Apocalypse  

// Устанавливаем иконки рядом с полями поиска  
$('.apomainsearch .queryField').attr('placeholder', 'Поиск по сайту').after('<img class="apomainsearchok" src="/img/aposearchb.png"><img class="apomainsearchico" src="/img/apomains.png" title="Поиск по всему сайту. Клик для переключения в поиск по модулю">');  
$('.apomodulesearch .queryField').attr('placeholder', 'Поиск по модулю').after('<img class="apomodulesearchok" src="/img/aposearchb.png"><img class="apomodulesearchico" src="/img/apomodules.png" title="Поиск по модулю. Клик для переключения в поиск по всему сайту">');  
// Проверяем, есть ли запись, какой поиск активен, в локальном хранилище  
if(localStorage.getItem('apomodulesearch')) {  
$('.apomodulesearch').fadeIn();  
} else {  
$('.apomainsearch').fadeIn();  
};  
// Обрабатываем клик по иконке "Поиск" у поиска по всему сайту  
$('.apomainsearchok').click(function() {  
// Активируем форму отправки  
$('.apomainsearch form').submit();  
});  
// Обрабатываем клик по иконке "Поиск" у поиска по модулю  
$('.apomodulesearchok').click(function() {  
// Активируем форму отправки  
$('.apomodulesearch form').submit();  
});  
// Обрабатываем клик по иконке выбора формы поиска у поиска по всему сайту  
$('.apomainsearchico').click(function() {  
// Записываем выбор поиска по модулю в локальное хранилище  
localStorage.setItem('apomodulesearch', 'apomodulesactive');  
// Сворачиваем поиск по сайту и разворачиваем поиск по модулю  
$('.apomainsearch').slideUp(300, function() {  
$('.apomodulesearch').slideDown(500);  
});  
});  
// Обрабатываем клик по иконке выбора формы поиска у поиска по модулю  
$('.apomodulesearchico').click(function() {  
// Сираем запись из локального хранилища  
localStorage.removeItem('apomodulesearch');  
// Сворачиваем поиск по модулю и разворачиваем поиск по сайту  
$('.apomodulesearch').slideUp(300, function() {  
$('.apomainsearch').slideDown(500);  
});  
});  

// apo-ucoz.com (c) 2013  
</script>


Как вы уже можете видеть, каждый элемент скрипта помечен комментарием, чтобы новичкам было удобно разбираться в том, какой участок за что отвечает — это поможет в написании своих кодов и модернизации данного скрипта

Три картинки из прикреплённого архива залейте в папку img



Выбор, типа, поиска, по, сайту, с, запоминанием, через, локальное, хр
Прикрепления: 8586547.png (44.2 Kb)
 
Форум » Вопросы по дизайну, управлению и настройки модулей СMS от uCoz! » СКРИПТЫ » Модуль Поиск по Сайту » Выбор типа поиска по сайту с запоминанием через локальное хр (Выбор типа поиска по сайту с запоминанием через локальное хр)
  • Страница 1 из 1
  • 1
Поиск: