如何使用jquery设置顶部位置

Raj*_*kla 63 jquery

我正在创建自定义div滚动条,并希望设置内容div的顶部位置.我的jquery代码如下:

containerOuterHeight=$("#messagePopUpContainer").outerHeight();
            contentOuterHeight=$("#content").outerHeight();
            contentTopPosition=$("#content").offset().top;
            alert("contentTopPosition"+contentTopPosition);
            alert(contentTopPosition-(containerOuterHeight/20));
            $("#content").offset().top=contentTopPosition-(containerOuterHeight/20);
            //$("#content").css("top",( contentTopPosition-(containerOuterHeight/20) ) + "px");
            alert("contentTopPosition"+$("#content").offset().top);
            //alert("Fontsize"+$('#content').css('font-size') );
Run Code Online (Sandbox Code Playgroud)

和HTML是:

<div id='messagePopUpContainer' style='background-color:#ffffff; overflow: hidden;'>
<a href='javascript:void(0);' id='popupanchor' onkeydown='PopupKeyHandler("' + elmId + '");'></a>
Run Code Online (Sandbox Code Playgroud)

<div id='content' style='width:350px'>' + methods.settings[elmId].text + '</div >
<div id='popupReturn'>Return</div></div></div>'
Run Code Online (Sandbox Code Playgroud)

Rav*_*dag 130

你可以使用CSS来做到这一点:

$("#yourElement").css({ top: '100px' });
Run Code Online (Sandbox Code Playgroud)


Sta*_*arx 62

使用.css()访问CSS属性和操作非常简单.例如,要更改单个属性:

$("selector").css('top', '50px');
Run Code Online (Sandbox Code Playgroud)


CG_*_*DEV 13

你也可以这样做

   var x = $('#element').height();   // or any changing value

   $('selector').css({'top' : x + 'px'});
Run Code Online (Sandbox Code Playgroud)

要么

你可以直接使用

$('#element').css( "height" )
Run Code Online (Sandbox Code Playgroud)

.css( "height" )和之间的区别在于.height()后者返回无单位像素值(例如400),而前者返回单位完整的值(例如,400px).当需要在数学计算中使用元素的高度时,建议使用.height()方法.jquery doc


Cam*_*ron 6

仅供参考,如果您正在使用:

 $(el).offset().top 
Run Code Online (Sandbox Code Playgroud)

要获取位置,它可以受父元素的位置影响。因此,您可能希望保持一致并使用以下内容进行设置:

$(el).offset({top: pos});
Run Code Online (Sandbox Code Playgroud)

与上面的 CSS 方法相反。