<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--還是在頭部中首先導入jQuery腳本，Hbuilder的快捷鍵是生存-->
<script src="../../js/jquery-3.2.1.js" type="text/javascript" charset="utf-8"></script>
<!--然後加入內聯樣式-->
<style type="text/css">
/*div的標籤選擇器*/
div{
/*寬高三百像素*/
width: 300px;
height: 300px;
/*背景顏色灰色*/
background: gray;
/*定位聲明*/
position: absolute;
}
</style>
</head>
<body>
<!--寫一個盒模型-->
<div></div>
</body>
<!--添加jQuery腳本規則的JavaScript代碼，使用jQuery腳本-->
<script type="text/javascript">
// 使用$()對div標籤進行選取
// .amimate是一個動畫方法
// .delay是一個延時方法
$('div').delay(1500).animate({
// 高度爲五百像素
'height':'500px'
},3000)
// 默認時間單位是微秒
</script>
</html>
【前端-JavaScript】H5中使用jQuery腳本 對靜態盒模型進行向下延伸動畫的記錄-魏泯
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章