I want to check if an element is visible and if yes, I want to scroll down to it. I am trying to achieve that with the following jquery:
var j = jQuery.noConflict(); jQuery(document).ready(function($) { if(j('#element').css('display') == 'block'){ j('body').scrollTo('#target'); }; }); but it does not work.
// jQuery no conflict mode var j = $.noConflict(); // retain meaning of jQuery's handle (optional but makes it // sometimes easier if you don't use one-letter assignments // of jQuery) (function($){ // document read $(function(){ // if element is visible (a visible #element was found) if $('#element:visible').size() > 0){ // scroll to #target $('body').scrollTo('#target'); } }); })(j); :visible makes it easier. You're can't just test against display=='block', you'd also have to test for inline-block and others in addition to checking the visibility setting. For example, the element could have display:block:visibility:hidden which doesn't make it :visible.
Try:
if($(element).is(":visible")) Refer to this post: How do I check if an element is hidden in jQuery?
var j = jQuery.noConflict(); jQuery(function($) { if($('#element').is(':visible')){ $('body').scrollTo('#target'); }; }); 