网站制作学习网JS脚本→正文:jquery访问设置CSS样式
字体:

jquery访问设置CSS样式

JS脚本 2010/9/6 18:51:48  点击:不统计

<网f站o学a习s制p作.cn>

jquery第十三课jqueryCss文档样式处理,包括读取,设置css样式;对于对象所处于窗口位置的访问设置;对于对象自身大小,内外部宽高等访问设置.
参考共用代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>jquery文档处理</TITLE>
<script language="javascript" src="jquery-1.4.2.min.js"></script>
<style>
.www {height:100px;background-Color:#ff0;}
.forasp {height:50px;}
.cn {height:80px;}
</style>
<SCRIPT language="javascript">
$(function(){
<!--jquery文档处理代码区-->
});
</SCRIPT>
<BODY>
<div id="1" class="www"></div><div id="2"></div><div id="3"></div>
</BODY>
</HTML>
1.CSS样式的访问与操作
(1).css(name); 获取对象的css样式name的值.
jquery实例:$("#1").css("height");返回值"100px".
(2).css(name, value);设置对象的css样式name为value值.
jquery实例:$("#1").css("height","50px"); 这样原来的id=1的div高度为50px
(3).css({name:value,name1,value1..});同时设置改变多个样式name的值value
jquery实例:$("#1").css({"name":"www.forasp.cn","width":"60px"});这样就设置了id=1的div的name值为www.forasp.cn,宽度width为60px
(4).css(name, function(index, value));可以通过函数来进行name值的筛选或者操作,index是对象数组的索引,value为原始值
jquery实例:$("div").css("height",function(index,value){return value*index}); 这样所有的div就将原来的高度乘以他们的索引,并付给自己.
2.对象位置的操作.
(1).offset();获取匹配元素在当前视口的相对偏移。返回的对象包含两个整型属性:top 和 left。此方法只对可见元素有效。
jquery实例:$("#1").offset().top; 获取id=1的对象的距顶部的距离.如果是.left则是距离左边的距离
(2).offset(coordinates); 设置对象的位置操作.coordinates可以是{top:100,left:500}的数组,也可以是object{left,top},function(index,coords){return value;}的操作函数,设置值和返回值,必须是成对出现.
jquery实例:$("#1").offset({top:100,left:100});这样就设置了id为1的对象的距顶部100px距左边100px
(3).position(); 获取匹配元素相对父元素的偏移。返回的对象包含两个整型属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。基本操作跟offset相似.
$("div:last").position().top; 返回最后一个div距离父级(body)顶部的距离
(4).scrollTop();获取匹配元素相对滚动条顶部的偏移。此方法对可见和隐藏元素均有效。
(5).scrollTop(val);传递参数值时,设置垂直滚动条顶部偏移为该值。此方法对可见和隐藏元素均有效。

今天学习比较少,明天继续.


http://%77%77%77%2E%66网站制作%6F学习网%72%61%73%70%2E%63%6E

·上一篇:jquery文档处理2 >>    ·下一篇:jquery访问设置CSS样式2 >>
推荐文章
最新文章