时间: 2020-08-25|tag: 18次围观|0 条评论

尺寸相关、滚动事件

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、获取可视区高度 

$(window).height();

4、获取页面高度 

$(document).height();

5、获取页面滚动距离

$(document).scrollTop(); 

$(document).scrollLeft();

6、页面滚动事件 

$(window).scroll(function(){ 

    ...... 

})

元素绝对位置

$(function(){

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

//offset().log(pos);

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

var w = $pos.ou是获取相对于页面左上角的绝对位置,即使外面再包一层con居中层,也不影响效果

var pos = $pos.offset();

// consoleterWidth();

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();

});

})

2019-06-17插图

文章转载于:https://www.jianshu.com/p/cf41db7a2775

原著是一个有趣的人,若有侵权,请通知删除

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自起风了,原文地址《2019-06-17
   

还没有人抢沙发呢~