人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

JSで文字の大きさの変更のプログラムを作っております。
各文字列をclassで、しかもpxで、文字の大きさを指定してしまっているのですが
これを変更するにはどうすればいいでしょうか??

例えば

<p class="style1">テスト</p>

.style1{
font-size : 9px;
}

というのが複数個あり、この文字列の大きさを変更したいです。


●質問者: makocan
●カテゴリ:インターネット ウェブ制作
✍キーワード:Class js PX テスト プログラム
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● tanukichi800
●35ポイント

classでなくidで指定してあったらgetElementByIdが使えるので簡単ですね。

http://www.openspc2.org/JavaScript/reference4/CSS/fontSize/index...


getElementsByClassというのが標準で存在しないので

http://oshiete1.goo.ne.jp/kotaeru.php3?q=2064524

のような方法を使うことになります。


まとめると

function resizebyclass(classname,size){

var el = document.getElementsByTagName('*');

for(var i = 0; i < el.length; i++){

if(el[i].className == classname){

el[i].style.fontSize = size + "px";

}

}

}

resizebyclass('style1',12);

ということをやればいいです。


またはこういうライブラリを使ってgetElementsByClassを使うのもいいでしょう。

http://www.dustindiaz.com/top-ten-javascript/


2 ● y-kawaz
●35ポイント

多分に以下のURLで開設されている内容かと思います。

http://www.kawaz.jp/pukiwiki/?JavaScript%A5%E1%A5%E2#wb6005c8


この解説のデモページで実際の実装をしたjsがあるので、この中の setCssValue 関数を使うことで実現できるんじゃないでしょうか?

例えば .style1 クラスの font-size を 20px にするには以下のようにすればよいと思います。

setCssValue('.style1', 'fontSize', '20px');

第2引数のスタイル名は CSS での表記ではなく Javascript の style オブジェクトのプロパティ形式で指定します。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ