溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
body {
font-size:13px;
line-height: 130%;
padding: 60px;
}
#panel{
width: 300px;
border: 1px solid #0050D0;
}
.head{
padding: 5px;
background: #96E555;
cursor: pointer;
}
.content{
padding: 10px;
text-indent: 2em;
border-top: 1px solid #0050D0;
display: block;
display: none;
}
.highlight{
background: #FF3300
}
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript">
/*
$(function() {
//show() hide() 方法中傳入毫秒數達到動畫效果
$(".head").toggle(function(){
$(".content").show(500);
},function(){
$(".content").hide(500);
});
})
*/
//只改變高度
/*
$(function() {
$(".head").toggle(function(){
$(".content").slideDown(500);
},function(){
$(".content").slideUp(500);
});
})
*/
//只改變透明度
/*
$(function() {
$(".head").toggle(function(){
$(".content").fadeIn(500);
},function(){
$(".content").fadeOut(500);
});
})
*/
//toggle()可以切換元素是否可見
//slideToggle通過高度變化來切換匹配元素的可見性
//fadeToggle通過透明度來切換可見性
//fadeTo把透明度以漸進的方式調整為執(zhí)行的值（0-1之間）
$(function() {
$(".content").show(500);
var i = 1;
$(".head").click(function(){
//$(".content").toggle(500);
//$(".content").slideToggle();
//$(".content").fadeToggle(1000);
$(".content").fadeTo("slow", i);
i = i - 0.1;
});
})
//
</script>
</head>
<body>
<div id="panel">
<h6 class="head">什么是JQuery？</h6>
<div class="content">
JQuery是一個JavaScript庫。
</div>
</div>
</body>
</html><script type="text/javascript">
$(document).ready(function()
{
alert($(window).height()); //瀏覽器當前窗口可視區(qū)域高度
alert($(document).height()); //瀏覽器當前窗口文檔的高度
alert($(document.body).height());//瀏覽器當前窗口文檔body的高度
alert($(document.body).outerHeight(true));//瀏覽器當前窗口文檔body的總高度 包括border padding margin
alert($(window).width()); //瀏覽器當前窗口可視區(qū)域寬度
alert($(document).width());//瀏覽器當前窗口文檔對象寬度
alert($(document.body).width());//瀏覽器當前窗口文檔body的高度
alert($(document.body).outerWidth(true));//瀏覽器當前窗口文檔body的總寬度 包括border padding margin
}
)
</script>免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
