Hello peoples,
I have mangled up the following to add fixed position left/right scroll links to a horizontal scrolling site:
$(document).ready(function() {
$('#container').append('<ul class="scroll_controllers"><li class="left"><a href="#" title="Scroll Left">«</a></li><li class="right"><a href="#" title="Scroll Right">»</a></li></ul>');
$('.right a').click( function(){
$.scrollTo( '+=600px', 900, {axis:'x'} );
return false;
});
$('.left a').click( function() {
$.scrollTo( '-=600px', 900, {axis:'x'} );
return false;
});
});
I’d really like to make it conditional on there being a need to scroll. Any idea what the best way to detect this would be?
Thanks in advance,
Rick
//scrol 1px to the left
$(document).scrollLeft(1);
//check if it scrolled
// if this is 0 than jQuery was not able to scroll to left
// because there is no posibility to (no scroll bar)
if($(document).scrollLeft() != 0){
// x-scroll
alert('there is a horizontal scroll bar\
you must have a small screen');
}else{
// no x-scroll
alert('there is NO a horizontal scroll bar');
}
//scroll back to original location
$(document).scrollLeft(0);
that should work
Ind It is quite invisible
note: only tested it in chrome, but it should work in the others
Ha! That works like a charm. I had been looking at ways to detect the presence of a scroll bar by calculating element sizes vs. window/viewport size etc etc and it was all getting very convoluted! I didn’t think to just scroll the damn thing! Thanks!
Rick