-
摘要和正文查看全部
-
收起與展開實現(xiàn)原理:首先定義一個容器,在容器中顯示選項內(nèi)容和隱藏內(nèi)容,在容器里放一個按鈕,鼠標點擊按鈕能夠執(zhí)行JavaScript function。在點擊按鈕展示隱藏層,再把按鈕改成hidediv<br>。當一個按鈕實現(xiàn)不同的點擊功能時,需要修改引用,用element.href屬性修改。 使用JavaScript實現(xiàn)動態(tài)效果,必須要有高度增加和高度減少事件。動畫展開時調(diào)用addH()函數(shù),停留一段時間后調(diào)用函數(shù)subH()減少高度。用onload事件在加載頁面完成時調(diào)用addH()。用document.getElementById()方法查找元素來控制元素的收起與展開。用onload事件和setTimeout來設置動畫。jQuery的toggle()方法,可以依次調(diào)用N個指定的函數(shù),直到最后一個函數(shù),然后重復對這個函數(shù)輪番調(diào)用語法:toggle(fn,fn2,...).jQuery中$(document).ready(function (){})或者 $(function(){}); 等同于window.onload=function (){}jQuery中text()修改文本內(nèi)容等同于js中的innerText()。 nextSibling:返回某個元素之后緊跟的元素(處于同一樹層級) previousSibling:返回某節(jié)點之前緊跟的節(jié)點(處于同一樹層級) parentNode 父節(jié)點查看全部
-
定時展開查看全部
-
顯示函數(shù) function showdiv(obj) { var x=obj.parentNode; var y=x.nextSibling; if(y.nodeType!=1){ y=y.nextSibling; } x.style.display="none"; y.style.display="block"; } // 隱藏函數(shù) function hidediv(obj) { var y=obj.parentNode.parentNode; var x=y.previousSibling; if(x.nodeType!=1){ y=y.previousSibling; } y.style.display="none"; x.style.display="block";查看全部
-
通過jQ代碼實現(xiàn)展開與收起效果 window.onload=function(){ $('a').bind('click',function(){ if($('a').html()=='更多選項+'){ $('a').html('收起'); $('#hpn').show(); }else{ $('a').html('更多選項+'); $('#hpn').hide(); } }) }查看全部
-
本章講的是展開與收起的效果 var h=0; //增加高度函數(shù)addH() function addh() { if(h<300){ h+=5; document.getElementById('pn').style.hight=h+'px'; } else{ return; } setTimeout('addh()',30); } //網(wǎng)頁加載完畢時,調(diào)用增加高度函數(shù)addH(),等待5秒鐘后調(diào)用減少高度函數(shù)subh()。 window.onload=function(){ addh(); setTimeout('subh()',5000); } // 減少高度函數(shù)subH() function subh() { if(h>0){ h-=5; document.getElementById('pn').style.height=h+'px'; } else{ document.getElementById('pn').style.display='none'; return; } setTimeout('subh()',30); }查看全部
-
高度要設置為自動 因為展開的隱藏層考慮查看全部
-
動態(tài)效果兩個,所以需要寫出調(diào)用的兩個函數(shù),一個是顯示隱藏層,一個收起隱藏層查看全部
-
盒子高度要設為自動高度,因為調(diào)用隱藏層時需要的高度會增加查看全部
-
思路是先想好需要幾個容器,把容器和需要在容器里寫的內(nèi)容寫出來查看全部
-
javascript的一個;分號不是用英文格式打的都會導致全部不能正常輸出,以后記得打代碼時切換輸入法而不是切換輸入狀態(tài),避免經(jīng)常錯誤重復檢查代碼查看全部
-
1.定義js里面放下和收起的函數(shù),再通過p段落引用用展開的函數(shù){ document.getElementById("hpn").style.display ="block"; document.getElementById("strHref").innerHTML="收起-" ; document.getElementById("strHref").href="javascript:hidediv()";} 2.p段落引用 <p class="slide"> <a href="javascript:showdiv()" id="strHref" class="btn-slide">展開</a> <!--點擊按鈕--> </p> 3.js函數(shù)的收起 document.getElementById("hpn").style.display ="none"; document.getElementById("strHref").innerHTML="更多" ; document.getElementById("strHref").href="javascript:showdiv()"; 4.收起同樣也需要按鈕收起的引用 <p class="slide"> <a href="javascript:showdiv()" id="strHref" class="btn-slide">展開</a> <!--點擊按鈕--> </p>查看全部
-
代碼:font-size:9pt;而自己在編寫的時候font-size:9px; 并不影響查看全部
-
大容器查看全部
-
<script type="text/javascript"> //高度增加事件,廣告層高度是通過w變量來控制 var W = 0; function addW() { if (W < 950) { W+=15; //將寬度W賦值給廣告層 document.getElementById("pn").style.width = W + "px"; } else { return; } setTimeout("addW();", 30); } window.onload = function showAds() { addW(); setTimeout("subW();", 5000); } function subW() { if (W > 0) { W-=15; document.getElementById("pn").style.width = W + "px"; } else {//寬度為0后,隱藏廣告層。 document.getElementById("pn").style.display = "none"; return; } setTimeout("subW()", 30); } </script> </head> <body> <div id="pn"> <h1>歡迎來到慕課網(wǎng)</h1> <h2>大幅廣告</h2> </div> <p class="foot">慕課網(wǎng)歡迎你</p>查看全部
舉報
0/150
提交
取消