Revision: 7354
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at July 18, 2008 15:59 by fredaudet
Initial Code
<script type="text/javascript">
window.addEvent('domready', function() {
if ( ($('container_Scroll_content').getSize().size.y) > ($('container_Scroll').getSize().size.y) ) {
myScrollFx = new Fx.Scroll('container_Scroll', {
wait: false
});
mySlide = new Slider($('areaScroll'), $('knobScroll'), {
steps: $('container_Scroll_content').getSize().size.y-($('container_Scroll').getSize().size.y),
mode: 'vertical',
onChange: function(step){
$('container_Scroll').scrollTo(0,step);
}
}).set(0);
}
else {
$('areaScroll').setStyle('visibility','hidden');
}
});
document.addEvent('mousewheel', function(e) {
e = new Event(e).stop();
var step = mySlide.step - e.wheel * 10;
mySlide.set(step);
});
</script>
<div id="container_Scroll">
<div class="text10pxWhite" id="container_Scroll_content">
THE END
</div>
</div>
<div id="areaScroll">
<div id="knobScroll"></div>
</div>
#knobScroll{
height: 25px;
width: 15px;
background-image:url(_images/slide.gif);
background-repeat:no-repeat;
cursor: pointer;
}
#areaScroll {
/*background-image:url(../_images/bg_slider.gif);
background-repeat:repeat-y;*/
background-color:#4b4a43;
height: 340px;
width: 15px;
float:right;
}
#container_Scroll {
margin:0px;
width: 500px;
height: 340px;
overflow:hidden;
float:left;
}
#container_Scroll_content {
padding:0px;
margin:0px;
width: 500px;
}
Initial URL
Initial Description
Initial Title
Custom Mootools Scroll
Initial Tags
Initial Language
JavaScript