增加和減小字體大小Bootstrap 3 Framework上的按鈕

我使用Bootstrap 3構建了一個網站。這個我現在想要的是2個按鈕。一個用於增加頁面所有元素的字體大小，另一個用於減小頁面的大小。（對於殘疾人）增加和減小字體大小Bootstrap 3 Framework上的按鈕

我使用這個jQuery腳本：

$(document).ready(function(){ 
    // Increase Font Size 
    $(".increase").click(function(){ 
    var currentSize = $('*').css('font-size'); 
    var currentSize = parseFloat(currentSize)*1.2; 
    $('*').css('font-size', currentSize); 

    return false; 
    }); 

    // Decrease Font Size 
    $(".decrease").click(function(){ 
    var currentFontSize = $('*').css('font-size'); 
    var currentSize = $('*').css('font-size'); 
    var currentSize = parseFloat(currentSize)*0.8; 
    $('*').css('font-size', currentSize); 

    return false; 
    }); 
    });

但我可以通過使用sellect所有*，按鈕第一下降看，然後增加或做其他事情。否則通過使用id名稱沒有任何反應。

// Increase Font Size 
    $(".increase").click(function(){ 
    var currentSize = $('#all-wrapper').css('font-size'); 
    var currentSize = parseFloat(currentSize)*1.2; 
    $('#all-wrapper').css('font-size', currentSize); 

    return false; 
    });

你可以看到2的jsfiddle here和here。我會很感激，如果你能建議我某事。謝謝！

來源

2014-02-10 dejix

你不能像你一樣增加乘法的字體大小！在第一種方法，當你做

var currentFontSize = $('*').css('font-size');

它會是按鈕，然後在接下來的句子將應用按鈕的1.2倍字體的每個元素在第一所選元素的字體大小。所以它首先減小到按鈕的字體大小然後增加。

雖然第二種方法可行，但$（'＃all-wrapper'）div的字體大小已超過h1標籤，因此它不可見。

爲了實現增加或減少字體功能，我們通常使用不同的字體大小來切換CSS。

來源

2014-02-10 12:58:41

感謝您的回覆。你能給我一個例子（也許是一個鏈接）切換不同的字體大小的CSS？ – dejix

$（「。btn」）。click（function（）{'link [href =「style2.css」]'）。attr（'href'，'style1.css'）; }）; –

謝謝..我嘗試先改變首先選擇的元素的字體大小，因爲沒有減少的按鈕增加點擊。雖然我可以改變它...似乎它不會改變任何增加行爲。再次它首先下降。你能幫助我嗎？ – dejix

增加和減小字體大小Bootstrap 3 Framework上的按鈕

回答

相關問題