<style type="text/css">
/*<![CDATA[*/
#foo {
width : 150px;
height : 150px;
background : red;
display : none;
position : fixed;
top : 45px;
left : 430px;
}
/*]]>*/
</style>
foo<br />
foo<br />
foo<br />
foo<br />
<div id="foo">
</div>
foo<br />
foo<br />
foo<br />
foo<br />
<script type="text/javascript">
/* <![CDATA[ */
var foo = document.getElementById('foo');
window.onscroll = function() {
foo.style.display = ((window.pageYOffset || document.documentElement.scrollTop) > 200) ?
'block' : 'none';
foo.style.background = ((window.pageYOffset || document.documentElement.scrollTop) > 400) ? 'green' : 'red';
};
/* ]]> */
</script>
Quelle: www.tutorials.de