欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)文章文字大小字號功能完整實(shí)例

 更新時(shí)間：2014年11月01日 12:09:10   投稿：shichen2014  
這篇文章主要介紹了js實(shí)現(xiàn)文章文字大小字號功能的實(shí)現(xiàn)方法,可根據(jù)用戶習(xí)慣調(diào)整顯示文字的大小.詳細(xì)講述了實(shí)現(xiàn)這一功能的完整步驟.是非常實(shí)用的技巧,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)文章文字大小字號功能的方法。分享給大家供大家參考。具體分析如下：

文字大中小是很多網(wǎng)站供用戶閱讀方便的一個(gè)功能，本文實(shí)例介紹的文字大中小字號功能可以在用戶選擇之后打開只要在同網(wǎng)站打開另一篇文章都會根據(jù)用戶習(xí)慣來顯示字體大小。

大家一定在某些大型網(wǎng)站看到過文章標(biāo)題下三個(gè)按鈕 “大”、“中”、“小”，用來照顧不同人的閱讀習(xí)慣。這里我就要介紹這種方法，而且比它們的還支持自動保存哦~只要選擇一次，下次閱讀自動調(diào)整到喜歡的字號。

JS 代碼部分：

首先把下邊的 JS 放到 JS 文件或者 script 標(biāo)簽里：

復(fù)制代碼 代碼如下:
jQuery.cookie = function(name, value, options) {
    if (typeof value != 'undefined') {
        options = options || {};
        if (value === null) {
            value = '';
            options.expires = -1;
        }
        var expires = '';
        if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
            var date;
            if (typeof options.expires == 'number') {
                date = new Date();
                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
            } else {
                date = options.expires;
            }
            expires = '; expires=' + date.toUTCString();
        }
        var path = options.path ? '; path=' + options.path : '';
        var domain = options.domain ? '; domain=' + options.domain : '';
        var secure = options.secure ? '; secure' : '';
        document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
    } else {
        var cookieValue = null;
        if (document.cookie && document.cookie != '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
                if (cookie.substring(0, name.length + 1) == (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
};
function SetFont(size){
    $.cookie('Font_size', size, { expires: 99999999 });
    $(".context").css("font-size",size);//.context 換成你文章內(nèi)容的容器
};
$(document).ready(function(){
    SetFont( $.cookie('Font_size') + 'px' );
});

注意把代碼的 .context 換成你的文章內(nèi)容容器。

Html 代碼部分：

然后在需要的地方調(diào)用下邊的代碼：

復(fù)制代碼 代碼如下:
<a href="javascript:SetFont(16)">大</a>
<a href="javascript:SetFont(14)">中</a>
<a href="javascript:SetFont(12)">小</a>

可以自定義 SetFont() 函數(shù)里的字號以及文字。

希望本文所述對大家基于javascript的web程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評論