关于jquery的笔记

Posted on 2017-01-24 18:56  Tokyomylove  阅读(104)  评论(0编辑  收藏  举报

1.on()函数的返回值为jQuery类型,返回当前jQuery对象本身。
2.jquery中设置背景图位置的方式。连接字符串:

$().css('backgroundPosition', ''+num+'px -93px');$().css("backgroundPositionX","+=30")

3.

$(window).load(function() {
$('.service').css('width','0').animate({width: '960px'
}, 2000);
});

4.clientXY,offsetXY,pageXY的区别:

offsetXY:是该事件发生的盒子模型里的坐标,与滚动条无关。
clientXY:是整个浏览器可用部分里的坐标,与滚动条无关。
pageXY:是整个网页里的坐标,与滚动条有关。
5.跳动的点,屏保效果

var nums=[0,-10,-20,-30,-40,-50,10,20,30,40];
var speed=500;
var imgs = $("#field2_img img");
//通过24次遍历,形成了一个数组direct,里面每一个元素都是一个对象
for(var i=0;i<24;i++){
var n=parseInt(Math.random()*10);
var m=parseInt(Math.random()*10);
direct[i]={top:n,left:m};
}
setInterval(function(){

for(var i=0;i<24;i++){
autoplay(i);
} 
},100);

}
//w:50 this_left:45 direct.left:7 52 -7 
function autoplay(num){
var this_top=parseInt($('#field2_img img').eq(num).css('top'));
var this_left=parseInt($('#field2_img img').eq(num).css('left'));
this_left+=direct[num].left;//
this_top+=direct[num].top;
var w=$(window).width();
if(this_left>w){
//this_left-=left;
direct[num].left=-direct[num].left;
}
if(this_left<0){
direct[num].left=-direct[num].left;
}
if(this_top<0){
direct[num].top=-direct[num].top;
}
if(this_top>=570){
direct[num].top=-direct[num].top;
}
$("#field2_img img").eq(num).css({
'top': this_top+"px",
'left': this_left+"px"}
);

}

6.jQuery 事件 - resize() 方法

当调整浏览器窗口的大小时,发生 resize 事件。
resize() 方法触发 resize 事件,或规定当发生 resize 事件时运行的函数。

7.$().position()与$().offset()

$().position()对象包含 相对位置坐标$().position().top()和 $().position().left()

$().offset()同理。

offset()始终返回相对于浏览器文档的距离,它会忽略外层元素。

position()获取相对于它最近的具有相对位置(position:relative或position:absolute)的父级元素的距离,如果找不到这样的元素,则返回相对于浏览器的距离。

 

      

      8.jq设置带!imortant的css

      

.css("cssText", "width:100%!important")