Example Scroller for a Game / Image Scroller
This Demo Show that you can also used the scroller for a Background Image for a Game or for special Effects.
D E M O ;)
Test W3C Validation:
HTML Code
<link rel="stylesheet" type="text/css" href="jscroller2-1.0.css">
<script type="text/javascript" src="jscroller2-1.61.js"></script>
<div id="scroller_container1">
<div class="jscroller2_left jscroller2_speed-80 jscroller2_alternate"> [Image] </div>
</div>
<div id="scroller_container2">
<div class="jscroller2_left jscroller2_speed-40 jscroller2_alternate"> [Image] </div>
</div>
<div id="scroller_container3">
<div class="jscroller2_left jscroller2_speed-20 jscroller2_alternate"> [Image] </div>
</div>
<div id="scroller_container4">
<div class="jscroller2_left jscroller2_speed-10 jscroller2_alternate"> [Image] </div>
</div>
CSS Code
/* Scroller Box */
#scroller_container1, #scroller_container2, #scroller_container3, #scroller_container4 {
position: relative;
width: 600px;
overflow: hidden;
margin: 0;
}
#scroller_container1 {
height: 150px;
}
#scroller_container2 {
height: 80px;
}
#scroller_container3 {
height: 45px;
}
#scroller_container4 {
height: 125px;
}
/* Scoller Box */
/* CSS Hack Safari */
#dummy {;# }
#scroller_container1, #scroller_container2, #scroller_container3, #scroller_container4 {
overflow: auto;
}