<table cellspacing="0" cellpadding="0"> <tr><td class="t_f" id="postmessage_34560"> <div class="blockcode"> <div id="code_fzv"><ol> <li> Web リソース コード ステーションのヒント: <html></li> <li><head> を更新する必要があるため、非表示の Web ページの一部を表示したり、ページを展開したり折りたたんだりする特殊効果をテストして、その効果を確認します。 </li> <li><title> JS 部分コンテンツ Web ページをロードするための特殊効果-dyunr.com</title></li> <li><style></li> <li>* { margin:0; padding:0;}</li> <li>body { text-align:center; 75% Verdana、Arial、Helvetica、sans-serif;}</li> <li>h1 { font:125% Arial、Helvetica、sans-serif; font-weight:bolder:#333; :ブロック; カラー:#99CC00}</li> <li> {幅:40%; 位置:相対; パディング:5px;}</li> <li> {位置:絶対右:8px; ; カーソル:ポインタ; 色: 黄色; </li> <li>p { テキスト整列: 左; 余白: 3px; 色: #99CC00} :300px;overflow:hidden}</li> <li>< /style></li> <li><script></li> <li>function $(element){</li> <li>return element = document.getElementById(element);</li> <li>}</li> <li>function $D(){</li> <li>var d=$ ('class1content');</li> <li>var h= d.offsetHeight;</li> <li>var maxh=300;</li> <li>function dmove(){</li> <li>h+=50; //レイヤーの展開速度を設定 23sc.cn</li> <li>if(h>=maxh) {</li> <li>d.style.height='300px' ;</li> <li>clearInterval(iIntervalId);</li> <li>}else{</li> <li>d.style.display='block';</li> <li>d.style.height=h+'px';</li> <li>}</li> <li>}</li> <li> iIntervalId=setInterval(dmove,2);</li> <li>} </li> <li>function $D2(){</li> <li>var d=$('class1content');</li> <li>var h=d.offsetHeight;</li> <li>var maxh=300;</li> <li>function dmove(){</li> <li> h-=50;//レイヤーの収縮速度を設定 23sc.cn</li> <li>if(h<=0){<li>d.style.display='none';<li>clearInterval(iIntervalId);<li>}else{<li>d.style .height=h+'px';<li>}<li>} <li>iIntervalId=setInterval(dmove,2);<li>}<li>function $use(){<li>var d=$('class1content');<li>var sb=$('stateBut ');<li>if(d.style.display= ='none'){<li>$D();<li>sb.innerHTML='expand';<li>}else{<li>$D2();<li>sb.innerHTML='shrink ';<li>}<li>}<li></script> </li> <li></head></li> <li><body></li> <li><div class="class1"></li> <li><h1>単独で非表示の効果を展開</h1></li> <li>< span id="stateBut" onclick="$use ()">展開</span></li> <li><p id="class1content">表示 Web ページの一部を非表示展開するページを折りたたむ特殊効果==小さなカタツムリは彼女に尋ねました。母: どうして私たちは生まれたときからこの重荷を背負わなければならないのですか? 硬くて重い殻はどうでしょうか? <br /></li> <li>お母さん: 私たちの体は骨で支えられていないので、這うことしかできませんが、それほど速くはできません。したがって、このシェルの保護が必要です。 <br /></li> <li>小さなカタツムリ: イモムシ姉さんには骨がないので、速く這うことができないのですが、なぜこの硬くて重い殻を背負う必要がないのですか? <br /></li> <li>ママ: あおむしのお姉ちゃんは蝶になれるから、23sc.cn 空が守ってくれるよ。 <br /></li> <li>小さなカタツムリ: でも、ミミズの兄弟には速く這える骨がないし、蝶にもならないのに、なぜこの硬くて重い殻を持たないの? <br /></li> <li>ママ: ミミズの兄弟は地面に穴を開けることができるから、地球が彼を守ってくれるから。 <br /></li> <li>小さなカタツムリは叫びました: 23sc.cn 私たちはとても可哀想です、空も地も私たちを守ってくれません。 <br /></li> <li>母カタツムリは彼を慰めました:私たちには貝殻があるのです!私たちは天にも地にも依存せず、自分自身に依存します。 </p></li> <li></div></li> <li></body>うまくいきますか?私たちの Web リソース サイトをサポートしていただきありがとうございます。私たちの Web サイトは http://www.dyunr.com です</li> <li> </li> <li>この記事の出典: Web リソース ネットワーク (www.dyunr.com) 転載およびコピーのために元のソースを保持してください、ありがとう詳細なソース参照: http://www.dyunr.com/Code/dm8/164.html</li> <li> </ol></div>コードをコピー<em onclick="copycode($('code_fzv'));"></em> </div> <img src="http://img.it-home.org/data/attachment/forum/2014pic/12114823_8D3j.jpg" alt="Web ページの一部の表示と非表示 ページの特殊効果の展開と折りたたみ" > </td></tr> </table> <div id="comment_34560" class="cm"> </div> <div id="post_rate_div_34560"> </div> <br>