{"id":2250,"date":"2022-08-30T15:23:18","date_gmt":"2022-08-30T15:23:18","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/01\/05\/animate-after-jquery-scroll-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:23:18","modified_gmt":"2022-08-30T15:23:18","slug":"animate-after-jquery-scroll-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/animate-after-jquery-scroll-collection-of-common-programming-errors\/","title":{"rendered":"animate after jquery scroll-Collection of common programming errors"},"content":{"rendered":"<p>I&#8217;m traying to animate a logo after scrolling animation or when i click any menu link but it&#8217;s not working.<\/p>\n<p>I got this code for animate scrolling:<\/p>\n<pre><code>jQuery(function() {\n            jQuery('a').bind('click',function(event){\n                var $anchor = jQuery(this);\n\n                jQuery('html, body').stop().animate({\n                    scrollTop: jQuery($anchor.attr('href')).offset().top\n                }, 2000,'easeInOutExpo');\n\n                event.preventDefault();\n            });\n        });\n<\/code><\/pre>\n<p>then, to animate the logo, if the windows position change, i made this:<\/p>\n<pre><code>jQuery(document).ready(function(){\n jQuery(window).bind('scroll',function(){\n        var wscroll = jQuery(this).scrollTop();\n        if(wscroll &gt; 500){\n            jQuery('#logo').delay(800).animate({\n                    left:'+48px'\n                    });\n            }else if(wscroll &lt; 500){\n                jQuery('#logo').animate({\n                    left:'-250px'\n                    });\n                }\n                console.log(wscroll);\n        });\n\n});\n<\/code><\/pre>\n<p>Here is the example<\/p>\n<p>But this is not working, not at all.<\/p>\n<p>Some guidance is appreciated. Tks in advance.<\/p>\n<ol>\n<li>\n<p>Note: console.log will cause the script to crash in Firefox.<\/p>\n<p>Also, the real issue is you need to use .stop() on the animation. It seems to be continually running the animation.<\/p>\n<\/li>\n<li>\n<p>you can use ScrollTo plugin and <code>OnAfter<\/code> function:<\/p>\n<pre><code>$(...).scrollTo( 'SomeWhere', 1600, {onAfter:function(){ \n   \/\/Your code\n} } );\n<\/code><\/pre>\n<\/li>\n<li>\n<p>i wrote simple example, maybe will help you. It working for me, but reaction of animation is quite slow &#8230; don&#8217;t know why :\/<\/p>\n<p>http:\/\/jsfiddle.net\/pVHwY\/1\/<\/p>\n<\/li>\n<\/ol>\n<p id=\"rop\"><small>Originally posted 2014-01-05 09:32:30. <\/small><\/p>","protected":false},"excerpt":{"rendered":"<p>I&#8217;m traying to animate a logo after scrolling animation or when i click any menu link but it&#8217;s not working. I got this code for animate scrolling: jQuery(function() { jQuery(&#8216;a&#8217;).bind(&#8216;click&#8217;,function(event){ var $anchor = jQuery(this); jQuery(&#8216;html, body&#8217;).stop().animate({ scrollTop: jQuery($anchor.attr(&#8216;href&#8217;)).offset().top }, 2000,&#8217;easeInOutExpo&#8217;); event.preventDefault(); }); }); then, to animate the logo, if the windows position change, i made [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2250","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2250","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=2250"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2250\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=2250"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=2250"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=2250"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}