2017-05-03 13 views
0

mvc Webアプリケーションがあり、cssはビューで使用されるスタイルシートでコード化されています。他の 言語に英語から言語文化の変更があった場合には、特定のクラスのフォントサイズのCSSは3px増加するカルチャー(言語)が変更された場合の動的フォントサイズ

、しかしとき:

次のシナリオを実現する方法はあります 他の言語の言語文化から英語に戻すと、フォントサイズ は元のサイズに3px戻って減少します。

これまでのオンライン研究されてきたが、C#のCurrentUICultureの読み取りを経由して変更するには、CSSスタイルシートでfont sizeを持っているの手掛かりを見つけることができませんでした(あるいはクッキーからの読み取り)

+0

あなたはすべてのTAのフォントサイズを意味していますg(h1-h6、p、li、div、span、e.t.c)をページ全体に表示しますか? – blecaf

+0

いいえ、特定のクラス名だけがフォントの言語の変更に関与し、言語を変更しないフォントはサイズの変更がありません –

+0

言語を識別し、スタイルの変更を定義するために、 CSS内 –

答えて

0

は、このコードをお試しください

$(function() { 
 
    $(document).on("click","div.selectLang select",function(){ 
 
    \t var curr=$("div.selectLang select").val(); 
 
    var arr=[".left",".left>p"];//list of elements to change fontsize 
 
    if(curr=="English"){ 
 
\t for(var i=0;i<=arr.length;i++){ 
 
      var fontSize = parseInt($(arr[i]).css("font-size")); 
 
    \t fontSize = fontSize - 3 + "px"; 
 
    \t $(arr[i]).css({'font-size':fontSize}); 
 
     } 
 
    } else if(curr=="Spanish"){ 
 
\t \t for(var i=0;i<=arr.length;i++){ 
 
      var fontSize = parseInt($(arr[i]).css("font-size")); 
 
    \t fontSize = fontSize + 3 + "px"; 
 
    \t $(arr[i]).css({'font-size':fontSize}); 
 
     } 
 
    } 
 
    }); 
 
});
.left { 
 
    font-size: 16px; 
 
} 
 
.left>p { 
 
    font-size: 20px; 
 
} 
 
.right { 
 
    font-size: 16px; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<div class="selectLang"> 
 
    <select> 
 
    <option value="English" selected>English</option> 
 
    <option value="Spanish">Spanish</option> 
 
    </select> 
 
    </div> 
 

 
    <div class="left"> 
 
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
 
    <p> 
 
    Where does it come from? 
 
    </p> 
 
    </div> 
 
    <div class="right"> 
 
    It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look lik 
 
    </div>