通過jQuery調整字體大小不適用於Chrome和Safari瀏覽器

我試圖在網站上實現字體大小調整功能。我寫了一些jQuery代碼，它可以在Mozila上完美運行，但不適用於Chrome，Safari等其他瀏覽器。在Chrome和Safari上，僅在第一次點擊時調整字體大小。這是我的代碼。

jQuery代碼通過jQuery調整字體大小不適用於Chrome和Safari瀏覽器

jQuery(document).ready(function(){ 

jQuery('[id="fontlarge"]').click(function(){ 
     jQuery('*').each(function(){ 
      var fontSize = jQuery(this).css('font-size'); 
      fontSize = fontSize.substr(0,2); 
      //alert(fontSize); 
      if(fontSize<=13) 
      { 
       var currentSize = jQuery(this).css('font-size'); 
       var currentSize = parseFloat(currentSize)+.2; 
       jQuery(this).css('font-size', currentSize); 
      } 
     }); 
    }); 

jQuery('[id="fontsmall"]').click(function(){ 
     jQuery('*').each(function(){ 
      var fontSize = jQuery(this).css('font-size'); 
      fontSize = fontSize.substr(0,2); 
      //alert(fontSize); 
      if(fontSize>=12) 
      { 
       var currentSize = jQuery(this).css('font-size'); 
       var currentSize = parseFloat(currentSize)-.2; 
       jQuery(this).css('font-size', currentSize); 
      } 
     }); 
    }); 
});

HTML代碼

<span id="fontsmall" style="cursor:pointer;">-</span>&nbsp;&nbsp;<span id="fontlarge" style="cursor:pointer;">+</span>

我不知道如何解決這個問題。

來源

2014-09-13 Jack Of All

不知道這會有所幫助，因爲它似乎針對特定瀏覽器，但......不是'[ID = 「fontlarge」]'你可以只使用'＃fontlarge'。與'[id =「fontsmall」]'和'＃fontsmall'一樣。 – DevlshOne 2014-09-13 09:22:01

@DevlshOne那麼DOM元素選擇器不是問題，因爲我可以通過兩種類型的選擇器#fontlarge和[id =「fontlarge」]觸發事件 – 2014-09-13 09:32:10

您可以使用整數來調整字體的大小，如果可以的話，應該解決它。

我注意到一件事到你的代碼，低於： -

fontSize.substr（0,2）

它總是會返回一個兩位數字，即使你有一個字體大小10.2，10.4等

所以這是由於該瀏覽器只擴展您的字體大小的唯一原因。我不知道爲什麼要在Firefox上工作，但它不應該在任何地方工作。

請使用fontSize.slice（0，-2）

來源

2014-09-15 15:08:59 Saurabh

通過jQuery調整字體大小不適用於Chrome和Safari瀏覽器

回答

相關問題