jquery教程之css处理

老雷PHP全栈开发

发布于 2020-07-02 15:14:28

9250

发布于 2020-07-02 15:14:28

老雷jquery教程之css处理

一、css 访问匹配元素的样式属性

css(name|pro|[,val|fn])

获取值

  $("p").css("height")

设置值

  $("p").css("height","160px")
  $("p").css({
    height:"100px",
    width:"100px",
    marginTop:"10px"
  })

二、offset 获取匹配元素在当前视口的相对偏移,针对浏览器窗口

offset([{top,left}])

设置

  $(".box").offset({ top: 10, left: 30 })

获取

  var p=$(".box").offset();
  $(".box").html( "left: " + offset.left + ", top: " + offset.top );

三、position() 获取匹配元素相对父元素的偏移。

返回的对象包含两个整型属性：top 和 left

  var position = p.position();
  $("div").html( "left: " + position.left + ", top: " + position.top );

四、scrollTop([val]) 获取匹配元素相对滚动条顶部的偏移

  $(".box").scrollTop(300);
  var s=$(".box").scrollTop()

五、scrollLeft([val]) 获取匹配元素相对滚动条左侧的偏移

  $(".box").scrollLeft(300);
  var s=$(".box").scrollLeft()

六、width 宽度,height 高度

  $("p").width();
  $("p").width(100);
  $("p").height();
  $("p").height(20);

七、innerWidth innerHeight

innerWidth 获取第一个匹配元素内部区域宽度（包括内补白、不包括边框）。

innerHeight 获取第一个匹配元素内部区域高度（包括内补白、不包括边框）。

$("p").innerWidth();

八、outerWidth outerHeight

outerWidth 获取第一个匹配元素外部宽度（默认包括内补白和边框）

outerHeight 获取第一个匹配元素外部高度（默认包括内补白和边框）。

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2019-12-04，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自老雷PHP全栈开发微信公众号，前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度