0

右側にあるさまざまなサイズの文字をクリックすると、フォント サイズが変更されるようにしたいと考えています。javascriptを使用してサイトにそれを行うように命令するにはどうすればよいですか? これが私がこれまでに持っているコードです:

  <!DOCTYPE html>
<html>
<head>
<body>

<div> 
 <font size="2"><a href="javascript:void(0);" onclick="changemysize(16);">A</a></font>
 <font size="4"><a href="javascript:void(0);" onclick="changemysize(20);">A</a></font>
 <font size="5"><a href="javascript:void(0);" onclick="changemysize(25);">A</a></font>

</div>

<div id="callout" class="medium">
    <ul id="controls">
        <li id="small">A</li>
        <li id="medium">A</li>
        <li id="large">A</li>
    </ul>
    <div id="mymain">
         <h1>Header</h1>

         <h2>Subheader</h2>

        <p>Lorem ipsum dolor sit amet, pri ne periculis definiebas, habeo gloriatur has id. Ius ad ubique animal, eum recteque electram explicari no, sed in nostrum adipiscing. Lorem ipsum dolor sit amet, pri ne periculis definiebas, habeo gloriatur has id.</p>
    </div>
</div>
<p style="margin-top: 100px; text-align: center; font-size: 75%;"><a href="../resize.zip">Download the files (resize.zip)</a>

</p>

<script src="resize.js"></script> 

</body>
</head>
</html>

Javascript:

function changemysize(myvalue) {
    var div = document.getElementById("mymain");
    div.style.fontSize = myvalue + "px";
}
4

2 に答える 2

0

手順:

  • css ファイルでフォントサイズを拡大するためのクラスを定義します。
  • あなたのliのonclickで関数を呼び出します
  • 関数に ur html body のそれぞれのクラスを追加/削除させますdocument.body.classList.add('nameOfTheClassWithFontSize');

参考：ページ全体のテキストフォントサイズを変更する

于 2013-10-31T21:26:32.673 に答える