使用Javascript增加頁面高度

我對JavaScript沒有任何瞭解，但我希望能夠單擊圖像並增加頁面大小。使用Javascript增加頁面高度

例子。一個500像素x 500像素的盒子，裏面有圖像。當你點擊一個圖像時，該框將增加到500px x 1000px，並在新區域內新增內容，而不更改頁面。

我該怎麼做？

喜歡上了這網站 http://kyanmedia.com/ 底部

來源

2009-06-06 Keiron Lowe

它是如何「增加」從500×500到500x100？ – 2009-06-06 08:36:16

100px小於500px ...你的意思是1000px？ – James 2009-06-06 08:36:29

點擊蚯蚓，你可以在頁面

<div id="extraDiv" style="display:none"> some extra stuff </div>

和使用JavaScript的底部有一個元素了，做一個

document.getElementById("extraDiv").style.display = "block";

使頁面更長時間。如果你想要動畫，那麼你可以使用jQuery，scriptaculous或其他JavaScript庫。

來源

2009-06-06 08:54:50

你可以使用jQuery做到這一點，這將有涼爽的滾動，而不是它只是彈出。有你在一個div主要內容，那麼你想要的內容在一個隱藏的div來顯示，比如：

<div>Main Content</div> 
<div id="hiddenLab" style="display:none">Content to show</div>

這樣，你會使用jQuery的slideToggle命令將其上下滑動，是這樣的：

<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $("#hidden").click(function(){ 
       $("#about").slideToggle("slow"); 
      }); 
     });  
    </script> 
    <style type="text/css"> 
     #maincontent { width:100%; height:100px;background:green} 
     #about { width:100%; height:1000px;display:none;background:red;} 
    </style> 
</head> 
<body> 
    <div id="maincontent"> 
     <a id="hidden" href="#">Click to see hidden</a> 
    </div> 
    <div id="about">Content to show</div> 
</body>

來源

2009-06-06 08:58:26 Fermin

使用Javascript增加頁面高度

回答

相關問題