`
java_frog
  • 浏览: 255682 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

left,pixelLeft,posLeft属性

 
阅读更多
1.clientHeight,   clientWidth:  
  这两个属性大体上显示了元素内容的象素高度和宽度.理论上说这些测量不考虑任何通过样式表加入  
  元素中的页边距,边框等.  
   
  2.clientLeft,clientTop:  
  这两个返回的是元素周围边框的厚度,如果不指定一个边框或者不定位改元素,他的值就是0.  
   
  3.scrollLeft,scrollTop:  
  如果元素是可以滚动的,可以通过这俩个属性得到元素在水平和垂直方向上滚动了多远,单位是象素.  
  对于不可以滚动的元素,这些值总是0.  
   
  4.scrollHeight,scrollWidth:  
  不管有多少对象在页面上可见,他们得到的是整体.

  5.style.left:  
  定位元素与包含它的矩形左边界的偏移量  
   
  6.style.pixelLeft:  
  返回定位元素左边界偏移量的整数像素值.因为属性的非像素值返回的是包含单位的字符串,例如,30px.   利用这个属性可以单独处理以像素为单位的数值.  
   
  7.style.posLeft:  
  返回定位元素左边界偏移量的数量值,不管相应的样式表元素指定什么单位.因为属性的非位置值返回的是包含单位的字符串,例如,1.2em  
   
     top,pixelTop,posTOp这几个类比就行了.  

function move(x) {
if (document.all) {
object1.style.pixelLeft += x;
object1.style.visibility = "visible"}
else if (document.layers) {
document.object1.left += x;
document.object1.visibility = "show"}}
分享到:
评论

相关推荐

    用javascript实现鼠标框选

    在Netscape和Firefox等非IE浏览器中,`style.left`属性返回的是带单位的字符串(如像素值'px'),而`style.pixelLeft`则返回不带单位的整数,这是IE浏览器特有的。开发者最初试图使用`style.left`来实现鼠标框选,但...

    web开发—页面小广告

    这里需要注意的是,`pixelLeft`和`pixelTop`属性在现代浏览器中并不常用,通常会使用`left`和`top`属性配合`px`单位来设置位置。此外,还需要初始化广告的位置: ```javascript function init() { smallleft = ...

    js 调色板 纯js

    function DisplayClrDlg(display) ... clrPanel.style.pixelLeft = left; clrPanel.style.pixelTop = top; clrPanel.style.display = "block"; } else { clrPanel.style.display = "none"; } }

    类似Flash效果的渐隐菜单 jquery 示例

    - 在 `menuItemIn()` 函数中,通过调整元素的 `pixelLeft` 属性以及 `filters.alpha.opacity` 属性来实现菜单项的移动和透明度变化,从而达到逐渐显示的效果。 - 在 `menuItemOut()` 函数中,同样通过改变 `...

    推拉门式菜单

    ,50)}function pullengine(){if (document.all&&themenu.pixelLeft)themenu.pixelLeft+=5else if(document.layers&&themenu.left)themenu.left+=5else if (window.pullit)clearInterval(pullit)}function drawengine...

    网上抓的一个特效

    函数`moveIEOut`和`moveIEBack`中,通过`if`语句检查元素的位置(`pixelLeft`属性),决定是否继续移动,实现了动画的停止和启动。 7. **浏览器兼容性处理**: `moveIEOut`和`moveIEBack`函数的命名暗示了这些函数...

    让你的图片实现可以拖动的效果

    2. `move()`函数:当鼠标移动时触发,检查是否允许拖动(`dragapproved==true`且鼠标左键按下),然后计算图片的新位置并更新`pixelLeft`和`pixelTop`属性,使图片跟随鼠标移动。最后返回`false`阻止默认的浏览器...

    网页鼠标特效.docx

    eval('curElement'+styleSwitch+'.pixelLeft=newleft') eval('curElement'+styleSwitch+'.pixelTop=newtop') } document.onmousemove = doMouseMove; ``` 然后,将以下代码加入到 HTML 的 `<body>` 部分: ``...

    JavaScript 特效笔记

    eval('curElement' + styleSwitch + '.pixelLeft=newleft'); if (event.clientY > (document.body.clientHeight - 5 - height)) { newtop = document.body.clientHeight + document.body.scrollTop - 5 - height...

    页面中浮动的DIV(可拖移)

    接下来是CSS部分,主要是利用绝对定位(`position: absolute`)使该元素脱离文档流,并能够通过改变`top`和`left`属性值来改变位置: ```css #floater { position: absolute; top: 79px; left: 552px; width: 228...

    JS对联漂浮广告代码

    - 分别处理IE和NS浏览器下的元素定位,通过修改`pixelTop`, `pixelLeft`, `top`, `left`属性,使元素随滚动条移动。 4. **定时器设置**: - 使用`setInterval()`函数每隔一定时间调用`heartBeat()`函数,确保元素...

    跟随页面上下浮动的客服代码特效

    if ((NS6||NS) && parseInt(ssm.left)|| IE && ssm.pixelLeft) { clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)} else {clearTimeout(moving);moving=setTimeout('null',1)}}; ...

    javascript浮动div,可拖拽div,遮罩层(div和iframe实现)

    - 通过 `style.left` 和 `style.top` 或 `style.pixelLeft` 和 `style.pixelTop` 属性动态设置 Div 的位置。 ### 二、可拖拽 Div 的实现原理 可拖拽 Div 指的是用户可以手动拖动 Div 在页面中的位置。这一功能...

    【速查手册】IE与FF下JS的区别

    - `style`对象:IE和FF对CSS属性的处理方式不同,如`style.pixelLeft`在IE中获取像素值,而在FF中使用`style.left`。 3. BOM(浏览器对象模型)差异: - `window.location.href`:在IE中,可以赋值改变页面URL,...

    js+html滑出式菜单

    if ((IE && ssm2.style.pixelLeft)||(NS && document.ssm2.left)) { if (IE) {ssm2.style.pixelLeft += (5%menuWidth); } if (NS) { document.ssm2.left += (5%menuWidth); } moving1 = setTimeout('move...

    网页特效代码

    document.all.tooltip2.style.pixelLeft = event.clientX + document.body.scrollLeft + 10 document.all.tooltip2.style.pixelTop = event.clientY + document.body.scrollTop + 10 document.all.tooltip2.style...

    Js之软键盘实现(源码)本篇文章来源于:开发学院 http://edu.codepub.com 原文链接:http://edu.codepub.com/2009/0512/4061.php

    使用`navigator.appName`属性来判断,并设置相应的CSS样式和位置属性,如`.left`, `.top`, `.pixelLeft`, `.pixelTop`等。这确保了软键盘能够在不同浏览器环境下正确显示。 #### 滚动同步 软键盘的另一个关键功能是...

    JavaScript时钟

    x[i].style.pixelLeft = Xpos + i * Xbase * Math.cos(sec); ``` 这里的`sec`是当前的秒数转换成的角度,通过`Math.PI * secs / 30`计算得到。类似地,分针和时针的位置也使用同样的方法计算。 #### 4. 利用`...

    跟随鼠标的萤火虫

    }}function scrolltip(){if (document.tooltip2.document.nstip.left>=-document.tooltip2.document.nstip.document.width)document.tooltip2.document.nstip.left-=5elsedocument.tooltip2.document.nstip.left=150...

    总结js中的一些兼容性易错的问题

    在IE6/7/8中,可以使用elem.runtimeStyle配合pixelLeft来进行像素化处理,而在现代浏览器中,可以使用width属性处理。 - 在Webkit核心的浏览器中,margin-right经常会出错。 三、查询操作 查询操作指的是通过特定...

Global site tag (gtag.js) - Google Analytics