jQuery $('#mydiv').css('top','500'); not working

With:

#mydiv{ position:relative; }

When I execute:

$('#mydiv').css('top','500开发者_StackOverflow');

Is not working, I'm not getting errors at all.

Basically what I need to do is move (not animate) that DIV 500px up, is there any other way to do it?

Telling it to set top: to 500px is going to move it down 500px from the relative position, not go up. You should be using a negative number, -500px for instance.

Moving it 500 px up:

First get the current position (this one is relative to the parent)

var topPosition = $('#mydiv').position().top;

Then move it

$('#mydiv').css('top',(topPosition - 500) + 'px');

you want to use 500px instead of just 500

Using Jquery .css function updates the top value but the changes are not reflected in screen.

Use $('#mydiv').offset({top: 500}); It will update the top value both in DOM and screen.

As far as I know, the '$' doesn't mean anything in a jQuery selection string. If you're trying to find the div with the id 'mydiv', use:

$('#mydiv').css('top', '500');

Try

$('#mydiv').css('top','500');

Note the pound sign (#) preceding the ID. You're using the dollar sign ($).

couple of things 1. you have a typo it should be #mydiv and not $mydiv (in the js part) 2. check with firebug if the element is being changed after the command is being executed.

Thanks

You need to have #myDiv as the jQuery selector: $("#myDiv")

And, if I remember right, your div container (parent) needs to be:

position: relative;

and your "#myDiv" needs to be:

position: absolute;

Are you sure jQuery is working? Also, make sure it isn't being loaded more than once.

Check if Jquery is loading in firebug. For testing also add an alert to make sure
$(function(){
alert('Jquery is loading');
});

If Jquery is loading, try this $('#mydiv').css({'top':'500px'});

In the CSS, after seting position: absolute; try to set "top:0px;". It may help.