- ベストアンサー
Javascriptを用いて文字サイズを変更可能にするには
ブラウザの『文字のサイズ』からではなく、Javascriptを用いてフォントサイズを変更させたいのですが、うまくいきません。 HTML紹介サイトにて、類似のものを見付けたのですが、こちらはボタンを使っています。文字リンク（<a href="javascript:fontsize1()">文字を大きく</a>のように）でフォントサイズを変えることは出来ないのでしょうか。 http://l-c.moo.jp/mozi40.htm ご存知の方がおられましたら、どうかご回答下さい。
- JavaScript
- 回答数4
- ありがとう数3
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
No2です。 私の場合は、リンクをクリックするときの「カチッ」っていう音をさせたくなかったので、以下の方法でやっていました。ご参考に。 <SCRIPT language="JavaScript"> <!-- var firstSize = 48; function fontSizeChange( s ){ text1.style.fontSize=s + "px"; } --> </SCRIPT> <BODY> <SPAN ID=text1>aaaa</SPAN>bbbb<BR> <SPAN onClick="fontSizeChange( 72 );" style="cursor:hand;">SPANで</SPAN> <BR> <SPAN onClick="fontSizeChange( 14 );" style="cursor:hand;">SPANで</SPAN> </BODY> この説明の方が、オブジェクト指向を理解しやすいかな。(^ ^ ;ゞ なお、スタイルシートで参照可能なプロパティは以下のページに詳しく載っています。 http://jp.selfhtml.org/javascript/objekte/style.htm fontSize 以外にもこれらの値を変更することによって色々出来ます。
その他の回答 (3)
- flowermaze
- ベストアンサー率56% (159/282)
文字サイズ変更スクリプト配布サイトがありました。
- campanella_77
- ベストアンサー率66% (35/53)
こんにちは。 以下を参考にしてください。 ------- ここから ---------------------------- <SCRIPT language="JavaScript"> <!-- function fontSizeChange( s ){ text1.style.fontSize=s + "px"; } --> </SCRIPT> <BODY> <SPAN ID=text1>aaaa</SPAN>bbbb<BR> <A HREF="#" onClick="fontSizeChange( 24 );">フォントサイズを24に</A><BR> <A HREF="#" onClick="fontSizeChange( 14 );">フォントサイズを14に</A> </BODY> ------------------------------------------- 紹介されたページと上の例を見ればわかるように、 意味としては、おおざっぱな説明をすれば ・IDが text1 で囲まれた部分のプロパティのフォントサイズを、 ・クリックというイベントが起きたら ・変更する。 という処理をしています。 紹介されたページでは、BODYタグでIDを指定していましたので、ページ全体になります。 ※注意 JavaScriptはもう3年前にやっていた程度なので、書式があってるか自信ありませんが・・・。 (^ ^ ;ゞ
- souta_n
- ベストアンサー率33% (79/234)
サイトをみました。 <a href="javascript:fontsize1()">文字を大きく</a> の部分以外に、HTMLのHerd部分にファンクションの記述がを、コピペしないと駄目でしょう。 これはフォントサイズを指定するファンクションfontsize1を呼び出すものですから。 それにしても<a href=はリンクですから、意味不明です。 これだと、文字を大きくという記述にリンクが貼られ、javascript:fontsize1()というサイトに飛ばすという意味になりますが・・・
お礼
済みません！ No.4さんの紹介して下さったページにその旨も記載してありました。こちらを参考に頑張ります。 ありがとうございました！
補足
ご回答ありがとうございます（＾＾） 早速試してみますと、campanella_77さんが書いて下さったソースそのままを記述するとフォントが変わったのですが、手を加えるとサイズが変わらないようになってしまいます。 と申しますのも、<body>の文字ではなく、<table>内の文字を変えたいと思っているからです。単純に考えて、<table id="text1">にしてみたのですが反映されませんでした。 あと、申し訳ないのですが、通常リンク（<a href="javascript:***">文字</a>）の方がリンクの色などを指定しやすいかなと思いまして^^;、記載して下さったアドレスの方を参考にさせていただきますと…… ------------------------------- <head>に <script type="text/javascript"> <!-- function MachGelb() { document.body.DynText.style.fontSize = "24pt"; } //--> </script> リンクを <a href="javascript:MachGelb()">gelb</a> ------------------------------- このように記述し、さらに<table>を<div id="DynText">～</div>ではさんだり、<table id="DynText">にしてみたり、上記<script>の『.body』を『.table』や『.td』にしてはみたのですが、残念ながら反映されませんでした。 惜しいところまで来ているような気がするのですが、もしお気付きの点等ございましたら、ぜひお教え下さい。