fontsize.jsでhtmlの大中小の設定を行っているのですが、ど
fontsize.jsでhtmlの大中小の設定を行っているのですが、どうしても大きさをデザイン上変更したくない文字の処理がわからなく困っております。
以下の設定なのですが、ヘッダー等に大きくすると崩れてしまう箇所があったり、
tableの中でも同様な箇所を変更しないようにしたいのです。
【html】
<p class="mess2"><img src="../common/images/title_size.gif" alt="サイズ" /><a href="#" id="smallLink"><img src="../common/images/bu_small.gif" alt="" id="small" /></a><a href="#" id="middleLink"><img src="../common/images/bu_middle_o.gif" alt="" id="middle" /></a><a href="#" id="largeLink"><img src="../common/images/bu_large.gif" alt="" id="large" /></a></p>
JSファイルの設定箇所
以下のほかにクッキーの処理、画像の処理、初期化の処理、load時の処理が記載
var now_size = 'middle';
// フォントサイズを小に変更
function smallFontSize(){
var size = "small";
setFontSize(size);
changeImage(size);
setCookie("@fontsize", size);
}
// フォントサイズを中に変更
function middleFontSize(){
var size = "middle";
setFontSize(size);
changeImage(size);
setCookie("@fontsize", size);
}
// フォントサイズを大に変更
function largeFontSize(){
var size = "large";
setFontSize(size);
changeImage(size);
setCookie("@fontsize", size);
}
// 指定されたフォントサイズに変更する
function setFontSize(size){
var fontSize;
var smallFontSize;
switch(size){
case "small":
fontSize = '11px';
smallFontSize = '10px';
break;
case "middle":
fontSize = '12px';
smallFontSize = '11px';
break;
case "large":
fontSize = '14px';
smallFontSize = '12px';
break;
}
$('a,p,td,th,li,dt,dd,pre').css("font-size", fontSize);
$('.smallText *').css("font-size", smallFontSize);
}
