2008年5月30日 星期五

動態調整字型大小的 (無障礙) JS+CSS語法

原本想幫部落格加上調整字型大小的語法,在網路上找了很多方法,以妹咕老師數位學習網的方法最簡單實用,請參考以下說明。

請依下列步驟執行:

1 開啟您已設計好的網頁 ,並進入程式碼編輯畫面

2 於</title>之後加入下列CSS語法

<style type="text/css">
<!--
.mybig{font-size:24px}
.mymil{font-size:14px}
.mysmall{font-size:10px}
-->
</style>


3 於CSS之後再加入下列 JAVA SCRIPT 語法

<script language="javascript">
function small(mysize)
{
if(mysize=="mybig")
{document.all.myfont.className="mybig"}
if(mysize=="mymil")
{document.all.myfont.className="mymil"}
if(mysize=="mysmall")
{document.all.myfont.className="mysmall"}
}
</script>


4 於<body>之後加入下列更改字型的連結內容

<a href="#" onClick="small('mybig')">大字</a><a href="#" onClick="small('mymil')">中字</a><a href="#" onClick="small('mysmall')">小字</a>

5 請於所有要變動的文字前加入下列HTML語法

<div id="myfont">
您的文章內容
</div>


完工!很簡單吧 ^^

轉載自:http://alexsir.blogspot.com/2008/02/blog-post_9800.html

1 意見:

Unknown 提到...

GOOGLE 瀏覽器不可運作