The slideDown applied to a div does the slideDown but doesn't scroll the page down and the div slided down div remains hidden from view. Is there a way to scroll the page down as well so the user can view the div?
views:
1201answers:
2
+5
A:
Quick demo here
Basically all you need is
$('html, body').animate({
scrollTop: $('#yourDiv').offset().top
}, 3000);
redsquare
2009-01-23 13:54:18
Yeah that seems to work. But if clicked again it gives the page a jerk and tries to animate again. Is there a way to check if the div is already visible and not animate?
Daud
2009-01-23 14:03:54
JimmyP helped below!
redsquare
2009-01-23 14:17:40
but maybe better as another Q!
redsquare
2009-01-23 14:18:10
+1
A:
$.extend($.expr[':'],{
inView: function(a) {
var st = (document.documentElement.scrollTop || document.body.scrollTop),
ot = $(a).offset().top,
wh = (window.innerHeight && window.innerHeight < $(window).height()) ? window.innerHeight : $(window).height();
return ot > st && ($(a).height() + ot) < (st + wh);
}
});
if ($('#whatever').is(':not(:inView)')) {
$('html,body').animate({
scrollTop: $('#whatever').offset().top
}, 3000);
}
J-P
2009-01-23 14:11:39