jQuery 錨點跳轉滾動條平滑滾動一句話代碼
2024-05-06 14:10:11
供稿：網友
jQuery錨點跳轉滾動條平滑滾動一句話代碼
代碼如下:$("html,body").animate({scrollTop: $("#box").offset().top}, 1000);
一下是一些jquery的小技巧
1. 控制編譯結果
代碼如下:
<script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></script>
<%if (false) { %>
<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>
<%}%>
2.
1.如果要使用jQuery提供的函數, 就要首先構造jQuery包裝集.
將Dom元素轉換成jQuery包裝集
代碼如下:
var div = document.getElementById("testDiv"); //Dom元素
var domToJQueryObject = $(div); //jQuery包裝
3.jQuery包裝集轉Dom對象
代碼如下:
var domObject = $("#testDiv")[0]; // 得到DOM對象
$("#testDiv").each(function() { $(this).html("修改內容") })//轉換為 jQuery包裝集操作
4。
代碼如下:
jQuery( callback )
Returns: jQuery
$(document).ready()的簡寫方式
--------------------------------------------------------------------------------
從零開始學習jQuery (三) 管理jQuery包裝集
代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Hello World jQuery!</title>
<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>
</head>
<body>
<hr />
<input id="btnShow" type="button" value="顯示----filter" />
<input id="btnHide" type="button" value="隱藏----filter" />
<!--============================begin js =============================================-->
<script type="text/javascript" >
$(
function(){
$("#btnShow").bind("click", function(event) { $(".filter").show();} ) ;
$("#btnHide").bind("click", function(event) { $(".filter").hide(500);} ) ;
}
);
// $("#btnChange").bind("click", function(event) { $("#divMsg").html("Hello World, too!"); });
</script>
<script type="text/javascript" >
//$("<div/>").css("border","solid 1px #FF0000").html("動態創建的div").appendTo(testDiv); //ok
//$("<div style=/"border:solid 1px #FF0000/">動態創建的div</div>") //not done
$(
function()
{
// alert("loaded!"); //加載完成后才執行
}
);
// alert("LODING。。。");//一遇到就執行
</script>
<!--============================end js =============================================-->
<script type="text/javascript">
//模板
</script>
<!-- 表格模板 -->
<table>
<tr>
<td></td><td></td>
</tr>
</table>
<script type="text/javascript">
function first(){//first
