Question

I’m trying to make a div float up from the bottom of the page using only javascript (NO JQUERY).

I have a fiddle here: http://jsfiddle.net/H7GSF/

It moves up once but won’t iterate to create an ‘animation’.

HTML

<div id="block"></div>​

CSS

#block { position: fixed; background: red; width: 100px; height: 20px; bottom: 0; }​

JS

b = 0;
el = document.getElementById('block');
setInterval(function(){
    b+=10;
    el.setAttribute('style','bottom:'+(b)+'px;');
},20);​

Answer 1

Because you are not updating the value of bottom. Its always 10

Try this,

b = 0;
el = document.getElementById('block');
setInterval(function(){
    b+=10;
    el.setAttribute('style','bottom:'+(b)+'px;');
},20);​