jquery特殊效果:
fadeIn() 淡入? ? ? ? fadeOut() 淡出
fadeToggle() 切換淡入淡出
hide() 隱藏元素? ? ? ? ?show() 顯示元素
toggle() 依次展示或隱藏某個元素
slideDown() 向下展開? ? slideUp() 向上卷起
slideToggle() 依次展開或卷起某個元素
例子: $btn.click(function(){
? ? ? ? $('#div1').fadeIn(1000,'swing',function(){
? ? ? ? ? ? alert('done!');
? ? ? ? });
? ? });
query動畫:通過animate方法可以設置元素某屬性值上的動畫,可以設置一個或多個屬性值,動畫執(zhí)行完成后會執(zhí)行一個函數(shù)
$('#div1').animate({
? ? width:300,
? ? height:300
},1000,swing,function(){
? ? alert('done!');
});
4.尺寸相關、滾動事件
1、獲取和設置元素的尺寸?
width()、height()? ? 獲取元素width和height
innerWidth()、innerHeight()? 包括padding的width和height?
outerWidth()、outerHeight()? 包括padding和border的width和height?
outerWidth(true)、outerHeight(true)?? 包括padding和border以及margin的width和height
2、獲取元素相對頁面的絕對位置? ?offset()
3、獲取可視區(qū)高度 $(window).height();
4、獲取頁面高度? ?$(document).height();
5、獲取頁面滾動距離??$(document).scrollTop()? ?$(document).scrollLeft();
6、頁面滾動事件??$(window).scroll(function(){? ? ? ......})
循環(huán)
$(function(){
// //給全部的li設置內(nèi)容和樣式
// $('.list li').html('111');
// $('.list li').css({background:'gold'});
//第一個參數(shù)index是索引值
$('.list li').each(function(index) {
// alert(index);//彈出索引值
//$(this)是每一個li
$(this).html(index);
});
})