JavaScript Tutorial/jQuery/height — различия между версиями
Admin (обсуждение | вклад) м (1 версия) |
|
(нет различий)
|
Текущая версия на 11:25, 26 мая 2010
Содержание
Get document height
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ alert($(document).height());
}); </script> <style> div{ width:200px; height:100px; overflow:auto; } h1 { width:1000px;height:1000px; } </style> </head> <body> <body>
header 1
</body>
</html></source>
Get tag height
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ alert($("div").height());
}); </script> <style> div{ width:200px; height:100px; overflow:auto; } h1 { width:1000px;height:1000px; } </style> </head> <body> <body>
header 1
</body>
</html></source>
height(): find the height of the window and document.
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ function showHeight(ele, h) { alert( h + "px."); } $("p").click(function () { showHeight("paragraph", $("p").height()); });
}); </script> </head> <body> <body>
Hello
Paragraph
</body>
</html></source>
height(val): If no explicit unit was specified (like "em" or "%") then "px" is concatenated to the value.
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("div").one("click", function () { $(this).height(30) .css({cursor:"auto", backgroundColor:"green"}); });
}); </script>
<style>
div { width:50px; height:70px; float:left; margin:5px; background:rgb(255,140,0); cursor:pointer; }
</style>
</head> <body> <body>
</body>
</html></source>
Set height to
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("div").height(300);
}); </script> <style> div{ width:200px; height:100px; overflow:auto; } h1 { width:1000px;height:1000px; } </style> </head> <body> <body>
header 1
</body>
</html></source>
Window height
<source lang="javascript">
<html>
<head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ alert($(window).height());
}); </script> </head> <body> <body>
Hello
Paragraph
</body>
</html></source>