HTML:
<body>
<div class="top-corner"></div> // absolute, top: 0
<div class="bottom-corner"></div> // absolute, bottom: 0
<a href="#" class="top-link">top</a> // fixed, top 50%, left 0
<a href="#" class="bottom-link">bottom</a> // fixed, top 60%, left 0
<div style="padding: 1500px 0;"></div> // for scroll test
</body>
Using scrollto plugin
http://demos.flesler.com/jquery/scrollTo/
JS
$(".top-link").hover(function(){
$("body").scrollTo($(".top-corner"), 3000);
},function(){
// stop on unhover
});
$(".bottom-link").hover(function(){
$("body").scrollTo($(".bottom-corner"), 3000);
},function(){
// stop on unhover
});
Animation works on hover. How to stop it on unhover?
Thanks.
