電子書籍の厳選無料作品が豊富!

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);
}

A 回答 (1件)

変更したくない箇所にclass="sonomama"とか付けられれば、


例<th class="sonomama">
jQueryのセレクターで除外出来るのでは、..
$('a,p,td:not(.sonomama),th:not(.sonomama),li,dt,dd,pre').css("font-size", fontSize);
みたいに、
あるいは、CSS定義の方で
!important
を付けるとか
    • good
    • 0
この回答へのお礼

ご連絡遅くなりすいません。
!importantでうまくいきました。
ありがとうございます。

お礼日時:2010/05/07 22:47

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!