JS實現(xiàn)文字放大效果的方法
更新時間：2015年03月03日 15:40:26 作者：代碼家園
這篇文章主要介紹了JS實現(xiàn)文字放大效果的方法,實例分析了javascript鼠標事件控制css樣式的技巧,需要的朋友可以參考下
本文實例講述了JS實現(xiàn)文字放大效果的方法。分享給大家供大家參考。具體實現(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實現(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>鼠標經(jīng)過橙色部分
<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實現(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>鼠標經(jīng)過橙色部分
<div id="test" onmouseover="setInterval('chanTxt()',100)" style="width:300px; height:50px; font-size:12px; line-height:50px; background:#f90;">腳本之家</div>
</body>
</html>
希望本文所述對大家的javascript程序設(shè)計有所幫助。
您可能感興趣的文章:
相關(guān)文章
這篇文章主要介紹了javascript跨域原因以及解決方案分享，十分的細致全面，有需要的小伙伴可以參考下。2015-04-04
下面小編就為大家分享一篇js讀取本地文件的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2017-12-12
這篇文章主要介紹了什么是JavaScript的防抖與節(jié)流,防抖是在頻繁觸發(fā)某一個事件時，一段時間內(nèi)不再觸發(fā)該事件后才會去調(diào)用對應(yīng)的回調(diào)函數(shù)，在設(shè)定間隔時間內(nèi)如果下一次事件被觸發(fā)， 那么就重新開始定時器，直到事件觸發(fā)結(jié)束，節(jié)流看下面文章的具體介紹吧2021-12-12
JS+CSS實現(xiàn)簡單的二級下拉導(dǎo)航菜單效果
這篇文章主要介紹了JS+CSS實現(xiàn)簡單的二級下拉導(dǎo)航菜單效果,通過簡單的JavaScript頁面元素遍歷及樣式操作實現(xiàn)下拉菜單效果,非常簡單實用,需要的朋友可以參考下2015-09-09
這篇文章主要為大家介紹了從Immutable.js到Redux函數(shù)式編程示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-04-04
本篇文章主要給大家講解了ES6/JavaScript使用技巧，需要的朋友參考一下吧。2017-12-12
javascript宿主對象之window.navigator詳解
這篇文章主要為大家詳細介紹了javascript宿主對象之window.navigator，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
在企業(yè)網(wǎng)站中常會看到企業(yè)地址會顯示在地圖上，那么，如何實現(xiàn)這種功能呢？本篇文章就主要介紹在網(wǎng)頁中插入百度地圖的步驟，下面就隨小編一起來看看吧2016-12-12
JavaScript跨瀏覽器獲取頁面中相同class節(jié)點的方法
這篇文章主要介紹了JavaScript跨瀏覽器獲取頁面中相同class節(jié)點的方法,本文講解使用getELementsByClassName函數(shù)解決這個需求,并給了一個開源的getELementsByClassName函數(shù)實現(xiàn),功能更加強大,需要的朋友可以參考下2015-03-03
這篇文章主要為大家詳細介紹了js實現(xiàn)滑動進度條效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08