2013-12-10 63 views
2

嘗試創建一些網站選項,用戶可以選擇自己的字體大小,並且我希望字體大小可以在整個網站上不同的頁面上進行維護等等。字體轉換工作正常,但我遇到了麻煩餅乾(使用它們第1次!)使用cookie調整字體大小

$(document).ready(function() { 

var Cookie = "Font Size"; 
var fontsize = normal; 

if($.cookie(Cookie)) { 
    fontsize = $.cookie(Cookie); 
    if (fontsize == "normal") { 
     $("#main p, #side p, #box p, .header li").css({"font-size": "12px"}); 
    } 
    else if (fontsize == "larger") { 
     $("#main p, #side p, #box p, .header li").css({"font-size": "14px"}); 
    } 
    else { 
     $("#main p, #side p, #box p, .header li").css({"font-size": "16px"}); 
    } 
} 
else { 
    $.cookie(Cookie, fontsize); 
} 
} 

function normalFont() { 
$("#main p, #side p, #box p, .header li").css({"font-size": "12px"}); 
fontsize = normal; 
$.cookie(Cookie, fontsize); 
} 

function largerFont() { 
$("#main p, #side p, #box p, .header li").css({"font-size": "14px"}); 
fontsize = larger; 
$.cookie(Cookie, fontsize); 
} 
function biggestFont() { 
$("#main p, #side p, #box p, .header li").css({"font-size": "16px"}); 
fontsize = biggest; 
$.cookie(Cookie, fontsize); 
} 

HTML: 我使用的按鈕上用onclick =「normalFont()等

還下載了Jquery的餅乾插件和

其鏈接

任何幫助表示讚賞,謝謝!

+1

語法錯誤'var fontsize = normal;',它應該是'var fontsize ='normal';'字符串文字'normal'應該包含在''''或''''' –

回答

2

有多種語法錯誤

//this should be in global scope 
var Cookie = "Font Size"; 
$(document).ready(function() { 

    //string literal 
    //also read the cookie value, if it is not present use the default value as `normal` 
    var fontsize = $.cookie(Cookie) || 'normal'; 

    if (fontsize == "normal") { 
     $("#main p, #side p, #box p, .header li").css({ 
      "font-size": "12px" 
     }); 
    } else if (fontsize == "larger") { 
     $("#main p, #side p, #box p, .header li").css({ 
      "font-size": "14px" 
     }); 
    } else { 
     $("#main p, #side p, #box p, .header li").css({ 
      "font-size": "16px" 
     }); 
    } 
}); //missing) here 

function normalFont() { 
    $("#main p, #side p, #box p, .header li").css({ 
     "font-size": "12px" 
    }); 
    //string literal 
    fontsize = 'normal'; 
    $.cookie(Cookie, fontsize); 
} 

function largerFont() { 
    $("#main p, #side p, #box p, .header li").css({ 
     "font-size": "14px" 
    }); 
    //string literal 
    fontsize = 'larger'; 
    $.cookie(Cookie, fontsize); 
} 

function biggestFont() { 
    $("#main p, #side p, #box p, .header li").css({ 
     "font-size": "16px" 
    }); 
    //string literal 
    fontsize = 'biggest'; 
    $.cookie(Cookie, fontsize); 
} 

演示:Fiddle

1

添加引號

var fontsize = "normal"; 

fontsize = "larger"; 

fontsize = "biggest";