Хотите немного уличной магии? Некоторым пользователям не нравится
размер текста на сайте. А Ctrl +/- увеличивают всю станицу, а не только
текст, что крайне не удобно. Ну так вот. Мы сделаем чтобы пользователь
мог изменить размер текста, и после обновления страницы текст не менял
обратно размер. А как так сделать? Для этого существуют куки. Знаете
что такое куки? Это такая штучка, которая хранит в себе данные, даже
после обновления страницы. Дэвид Блейн? Аха! К черту теорию, перейдем к
практике. Как создать кукисы?
Как создать кукисы?
Создадим функцию сохранения кукиса:
Code
function setcookie(name,value,expires,path,domain,secure){
var today=new Date();
var expires_date=
new Date(today.getTime()+(expires*1000));
document.cookie=name+'='+escape(value)+
(expires ? ';expires='+expires_date.toUTCString():'')+
(path ? ';path='+path:'')+
(domain ? ';domain='+domain:'')+
(secure ? ';secure':'')}
В этот код сильно вникать не надо.
Далее создадим функцию вызова кукиса:
Code
function getcookie(name){
var aCookie = document.cookie.split(';');
for(var i=0;i<aCookie.length;i++){
while(aCookie[i][0]==' '){
aCookie[i]=aCookie[i].substr(1);
}
var aCrumb=aCookie[i].split('=');
if(name==aCrumb[0]){
return unescape(aCrumb[1]);
}
}return null;
}
Для этого скрипта я взял TrackBar:
Code
$(function(){
$('#trackbar').trackbar({
onMove : function(){
setcookie('font',this.leftValue);
//При перемещении ползунка, создается печенька
if(getcookie('font')==null){setcookie('font',8)}
//Если кукис не создан, то он создастся с числом 8
document.body.style.fontSize=this.leftValue+'pt';
//При перемещении ползунка будет изменяться и размер шрифта
},
dual:false, //Ну это особенность TrackBar'а
width:100, //Ширина TrackBar'а в px
leftLimit:8, //Минимальный размер шрифта
leftValue:getcookie('font'), /* Число вытаскивается из кукиса
и вставляется сюда */
rightLimit:17, //Максимальный размер шрифта
rightValue:0 //Это оставьте как есть
});
});
Все скрипты в архиве.
Теперь нам надо только добавить туда, куда нужно, див с идом "trackbar":
Вот и все.
Меню сайта
Меню сайта
