web-dev-qa-db-ja.com

div要素全体をxピクセル上に移動する方法は？

Div全体とその内容を約10〜15ピクセル上に再配置したい。

これどうやってするの？

注：これはスライダー要素なので、ボタンをクリックするとスライダーが下にスライドします。完了したら、約15ピクセル上に再配置します。

javascriptjquerytelerik
39
codecompleting
_$('#div_id').css({marginTop: '-=15px'});
_

これにより、ID「div_id」を持つ要素のCSSが変更されます

必要な効果を得るには、アニメーションのコールバック関数に上記のコードを追加することをお勧めします（アニメーションが完了するとdivが上に移動します）。

_$('#div_id').animate({...}, function () {
    $('#div_id').css({marginTop: '-=15px'});
});
_

そしてもちろん、マージンの変化をアニメーション化することもできます：

_$('#div_id').animate({marginTop: '-=15px'});
_

JQueryの.css()のドキュメントは次のとおりです。 http://api.jquery.com/css/

そして、jQueryの.animate()のドキュメントは次のとおりです。 http://api.jquery.com/animate/

47
Jasper
$('div').css({
    position: 'relative',
    top: '-15px'
});
27
gislikonrad

Cssでこれを要素に追加します。

margin-top: -15px; /*for exact positioning */
margin-top: -5%; /* for relative positioning */

どちらかを使用して適切に配置できます。

4
srinivas