博客网 >

Sample that roll down automatically
作者:分类:默认分类标签:

this sample shows you how to make an automatically roll down div :)

<html>
<head >
<style>
#content,#intro{
 font: 13px/25px;
 width: 200px;
 height: 40px;
 background: #eee;
 padding: 10px;
 border: 4px #ccc double;
        border-bottom:0;
 overflow: hidden;
}

#intro {
 color: #036;
 font:12px;
        border: 4px #ccc double;
        border-top:0;
        height:70px;
}
#key{color:#900;float:right}
hr{height:1px;border:1px #ccc dotted}
</style>
</head>
<body >
<script type="text/javascript">
var s=5;
var minheight=40;
var maxheight=500;
function shoppingcat(){
 var key = document.getElementById("key");
 var contentDiv=document.getElementById ("content");
 var heightText=contentDiv.style.height;
 var height=0;
 if(heightText!="")
  height=parseInt(heightText.replace(/px/,""));
 if(key.innerHTML=="展开"){
  height+=s;
  contentDiv.style.height=height+'px';
  if(height<maxheight){
   setTimeout("shoppingcat();",1);
  }else{
   key.innerHTML="关闭";
  }
 }else{
  height-=s;
  contentDiv.style.height=height+'px';
  if(height>minheight){
   setTimeout("shoppingcat();",1);
  }else{
   key.innerHTML="展开";
  }
 }
}
</script>
<div id="content">
孤雁儿
<br><br>
世人作梅词,下笔便俗。予试作一篇,乃知前言不妄耳。<br><br>
藤床纸帐朝眠起,<br>
说不尽、无佳思。<br>
沈香烟断玉炉寒,<br>
伴我情怀如水。<br>
笛声三弄,<br>
梅心惊破,<br>
多少春情意。<br><br>

小风疏雨萧萧地,<br>
又催下、千行泪。<br>
吹箫人去玉楼空,<br>
肠断与谁同倚?
一枝折得,<br>
人间天上,<br>
没个人堪寄。
</div>

<div id="intro" ><hr>作者:李清照<span id="key"  onmousemove="shoppingcat();">展开</span><br>来源

:中国诗辞网</div>
</body>
</html>

<< GetExactPosition... / FAQ and Resource... >>

专题推荐

不平凡的水果世界

不平凡的水果世界

平凡的水果世界,平凡中的不平凡。 今朝看水果是水果 ,看水果还是水果 ,看水果已不是水果。这境界,谁人可比?在不平凡的水果世界里,仁者见仁,智者见智。

中国春节的那些习俗

中国春节的那些习俗

正月是农历新年的开始,人们往往将它看作是新的一年年运好坏的兆示期。所以,过年的时候“禁忌”特别多。当然,各个地方的风俗习惯不一样,过年的禁忌也是不一样的。

评论
0/200
表情 验证码:

gisman

  • 文章总数0
  • 画报总数0
  • 画报点击数0
  • 文章点击数0
个人排行
        博文分类
        日期归档