JS實(shí)現(xiàn)文字放大效果的方法
更新時(shí)間:2015年03月03日 15:40:26 作者:代碼家園
這篇文章主要介紹了JS實(shí)現(xiàn)文字放大效果的方法,實(shí)例分析了javascript鼠標(biāo)事件控制css樣式的技巧,需要的朋友可以參考下
本文實(shí)例講述了JS實(shí)現(xiàn)文字放大效果的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS實(shí)現(xiàn)文字放大效果</title>
<script type="text/javascript">
var n = 12;
function chanTxt()
{
var obj = document.getElementById("test");
if(n <= 42)
{
obj.style.fontSize = n+"px";
}
n++;
}
</script>
</head>
<body>鼠標(biāo)經(jīng)過(guò)橙色部分
<div id="test" onmouseover="setInterval('chanTxt()',100)" style="width:300px; height:50px; font-size:12px; line-height:50px; background:#f90;">腳本之家</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS實(shí)現(xiàn)文字放大效果</title>
<script type="text/javascript">
var n = 12;
function chanTxt()
{
var obj = document.getElementById("test");
if(n <= 42)
{
obj.style.fontSize = n+"px";
}
n++;
}
</script>
</head>
<body>鼠標(biāo)經(jīng)過(guò)橙色部分
<div id="test" onmouseover="setInterval('chanTxt()',100)" style="width:300px; height:50px; font-size:12px; line-height:50px; background:#f90;">腳本之家</div>
</body>
</html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- js 圖片放大效果 修正版
- 原生JS仿蘋(píng)果任務(wù)欄菜單,放大效果的菜單
- 電子商務(wù)網(wǎng)站上的常用的js放大鏡效果
- 原生js寫(xiě)的放大鏡效果
- js實(shí)現(xiàn)圖片放大縮小功能后進(jìn)行復(fù)雜排序的方法
- JS實(shí)現(xiàn)點(diǎn)擊圖片在當(dāng)前頁(yè)面放大并可關(guān)閉的漂亮效果
- JS簡(jiǎn)單的圖片放大縮小的兩種方法
- 圖片放大鏡jquery.jqzoom.js使用實(shí)例附放大鏡圖標(biāo)
- js實(shí)現(xiàn)單擊圖片放大圖片的方法
- js實(shí)現(xiàn)雙擊圖片放大單擊縮小的方法
- Js可拖拽放大的層拖動(dòng)特效實(shí)現(xiàn)方法
- JS實(shí)現(xiàn)圖片放大鏡效果的方法
- JS文字球狀放大效果代碼分享
相關(guān)文章
JS+CSS實(shí)現(xiàn)簡(jiǎn)單的二級(jí)下拉導(dǎo)航菜單效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)簡(jiǎn)單的二級(jí)下拉導(dǎo)航菜單效果,通過(guò)簡(jiǎn)單的JavaScript頁(yè)面元素遍歷及樣式操作實(shí)現(xiàn)下拉菜單效果,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-09-09javascript宿主對(duì)象之window.navigator詳解
這篇文章主要為大家詳細(xì)介紹了javascript宿主對(duì)象之window.navigator,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09JavaScript跨瀏覽器獲取頁(yè)面中相同class節(jié)點(diǎn)的方法
這篇文章主要介紹了JavaScript跨瀏覽器獲取頁(yè)面中相同class節(jié)點(diǎn)的方法,本文講解使用getELementsByClassName函數(shù)解決這個(gè)需求,并給了一個(gè)開(kāi)源的getELementsByClassName函數(shù)實(shí)現(xiàn),功能更加強(qiáng)大,需要的朋友可以參考下2015-03-03js實(shí)現(xiàn)滑動(dòng)進(jìn)度條效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)滑動(dòng)進(jìn)度條效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-08-08