小白的jquery学习之路07css属性操作

最新推荐文章于 2025-07-10 15:23:16 发布

weixin_37770640

最新推荐文章于 2025-07-10 15:23:16 发布

阅读量130

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_37770640/article/details/80636558

本文介绍了使用jQuery进行网页元素尺寸和位置的操作方法，包括如何获取和设置元素的高度、宽度、内外边距等尺寸属性，以及如何通过offset和scroll等方法控制元素的位置。还提供了一个示例，展示了如何根据滚动条的位置改变元素的定位。

CSS

CSS
- css(name|pro|[,val|fn])^1.9*
- jQuery.cssHooks
位置
尺寸
- outerWidth([options])

设置属性 css $().css({"height":"200px","width":"100px"})

位置offset 距离页面的偏移 position是距离有position属性的父元素的距离

scrollTop滚动高度

27 如果导航条的scrollTop值大于400，那么设置其为固定定位，反之取消

$(function(){
	//给浏览器加滚动条事件
	$(window).scroll(function(){
	//获得滚动上的距离
		var t=$(document).scrollTop();
		document.title=t;
		if(t>400){
         $(".p2").addClass('buyiyang')
		}
		else{
		 $(".p2").removeClass('buyiyang')

		}
	})

})

尺寸获取内容的高度

var re=$("#news").height();

//设置内容的高度

$("#news").height(1000);
//获取内容加内边距+内容的高度
var re=$("#news").innerHeight();
document.title=re;
//获取内容加总高度内边距+内容+border+外边距
var re=$("#news").outerHeight();
document.title=re;