元素绝对位置

$(function(){

var $pos = $('.pos');

//offset()是获取相对于页面左上角的绝对位置，即使外面再包一层con居中层，也不影响效果

var pos = $pos.offset();

// console.log(pos);

// alert(pos.left + "," + pos.top);

var w = $pos.outerWidth();

var h = $pos.outerHeight();

// alert(w);

$('.pop').css({left:pos.left + w,top:pos.top});

$pos.mouseover(function() {

$('.pop').show();

});

$pos.mouseout(function() {

$('.pop').hide();

});

---

鼠标移入移出

源码：

.box{

width: 200px;

height: 200px;

background-color: gold;

margin: 100px auto 0;

}

.son{

width: 100px;

height: 100px;

background-color: green;

}

$('#div1').hover(function() {

$(this).stop().animate({marginTop: 50});

}, function() {

$(this).stop().animate({marginTop: 100});

});

---

input框事件

$(function(){

// //一开始就获取焦点，相当于设置了autofocus自动获取焦点了（HTML5 新增表单控件属性）

// $('#txt01').focus();

// //文本框获取焦点的时候（有光标闪烁的时候）

// $('#txt01').focus(function() {

// alert('focus');

// });

// //失去焦点的时候（光标离开的时候）

// $('#txt01').blur(function() {

// alert('blur');

// });

// //输入框内容发生变化的时候，失去焦点后触发，可用于注册时验证用户名是否已存在

// $('#txt01').change(function() {

// alert('change');

// });

//松开键盘按键就触发

$('#txt01').keyup(function() {

alert('keyup');

});

})

---

jQuery其他事件

// //JS原生写法

// window.onload = function(){

// }

// //jQuery写法，等同于上面写法

// $(window).load(function(){

// })

// //ready的写法

// $(document).ready(function(){

// })

// //ready的简写

// $(function(){

// })

// 窗口改变尺寸的时候，会高频触发

$(window).resize(function() {

console.log('3');

});