2012-05-15 22 views
49

Estoy creando un desplazador de div personalizado y quiero establecer la posición superior del div de contenido. Mi código de jQuery es la siguiente:Cómo establecer la posición superior usando 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')); 

y HTML es:

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

<div id='content' style='width:350px'>' + methods.settings[elmId].text + '</div > 
<div id='popupReturn'>Return</div></div></div>' 
+0

Pruebe '$ (elemento) .position()' ** (** '$ (elemento) .position(). Top' y' $ (elemento) .position(). Left' **) ** – KingRider

Respuesta

105

Puede usar CSS para hacer el truco:

$("#yourElement").css({ top: '100px' }); 
54

UN la propiedad CSS de cceso & manipular es bastante fácil usando .css(). Por ejemplo, para cambiar sola propiedad:

$("selector").css('top', '50px'); 
2

Y con Prototipo:

$('yourDivId').setStyle({top: '100px', left:'80px'}); 
+0

'setStyle()' es solo para elementos dom. Use 'css()' en su lugar. –

9

También puede hacer

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

    $('selector').css({'top' : x + 'px'}); 
0

Sólo como referencia, si está utilizando:

$(el).offset().top 

Para obtener la posición, puede verse afectada por la posición del elemento principal. Por lo tanto es posible que desee ser coherente y usar lo siguiente para configurarlo:

$(el).offset({top: pos}); 

A diferencia de los métodos CSS anteriormente.

Cuestiones relacionadas