Title: Window scroll after posts are loaded Last modified: August 22, 2016 --- # Window scroll after posts are loaded * [downfast](https://wordpress.org/support/users/downfast/) * (@downfast) * [11 years, 5 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/) * Hi how can I change how much the window scroll when new posts are loaded after clicking the load button more? * I have the seo add on and I believe the bit of code is this one: * ``` almSEO.scrollToPage = function(obj){ var top = $(obj).offset().top - 200 + 'px'; $('html, body').delay(250).animate({ scrollTop: top }, almSEO.speed, "alm_easeInOutQuad"); } ``` * but I am not sure as I am trying to change it and I have no luck. * What I use that it works is: * `$('html, body').animate({scrollTop:$(".is-expanded").position().top -10}, 1000);` * WIth that the window scroll and have a div .is-expanded be at 10 from the top of the window. I would like to do the same when the new content is loaded with your plugin. AT the moment it isn’t scrolling enough. I am not sure I am loooking at the right place * Thanks * [https://wordpress.org/plugins/ajax-load-more/](https://wordpress.org/plugins/ajax-load-more/) Viewing 5 replies - 1 through 5 (of 5 total) * Thread Starter [downfast](https://wordpress.org/support/users/downfast/) * (@downfast) * [11 years, 5 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5616886) * OK i think is this bit * ``` almSEO.getCurrentPageTop = function(page){ // Get children var objs = $('.alm-reveal').eq(0).children() ? $('.alm-reveal').eq(0).children() : ''; if(objs.length){ var objType = objs[0].nodeName.toLowerCase(), obj = page * almSEO.postsPerPage - almSEO.postsPerPage; var objSelected = $('.alm-listing .alm-reveal > ' + objType).eq(obj); if(almSEO.scroll) almSEO.scrollToPage(objSelected); } } ``` * But I am using isotope (masonry) therefore may change the container height. Any idea? * Plugin Author [Darren Cooney](https://wordpress.org/support/users/dcooney/) * (@dcooney) * [11 years, 5 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5617004) * Im not really sure about this one because I have not used the SEO plugin with Masonry. * Both those functions are intended to locate the top position of the first item of the current page. * Masonry is definitely uncharted waters for the plugin. If you have some time maybe leave it with me and after the holidays I can put together an example. * Thread Starter [downfast](https://wordpress.org/support/users/downfast/) * (@downfast) * [11 years, 4 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5617192) * Quick update on this: * It’s not a real solution maybe but this is what I thought so far: * ``` var pos = $("#list").height(); jQuery('html, body').animate({scrollTop:'+=' + pos + 'px'}, 1000).offset().top; ``` * $(“#list”).height is the height of the isotope (masonry) container when it first loads, then each time I am loading new content, I am scrolling the window for as much as the saved height of the container at the beginning. * Thread Starter [downfast](https://wordpress.org/support/users/downfast/) * (@downfast) * [11 years, 4 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5617193) * Follow up on this: * ``` jQuery.fn.almComplete = function(alm){ if(!$("body").hasClass("loadedList")) { setTimeout(function(){ $("body").addClass("loadedList"); pos = jQuery("#list").height(); }, 2000); } else { $("body, html").animate({scrollTop:'+=' + pos + 'px'}, 1000).offset().top; } } ``` * Basically I am checking if the body has a class on content loaded, if it does not, I am awaiting for 2 secs for all content to be properly loaded and layed out with isotope (masonry) and setting a global var for the container height. Afterwards when loading new content, I am skipping to set the height as the body has the class and I am scrolling to that var height px. * Since I am loading different amount of content if we are on mobile I am doing this in my index.php * ```
``` * So I am loading only 4 posts if we are on mobile and 10 if we are on desk. Since we are loading only 4 posts, when on mobile I need to scroll to half of the container height like this: * ``` if(!$("body").hasClass("loadedList")) { setTimeout(function(){ $("body").addClass("loadedList"); pos = jQuery("#list").height(); }, 2000); } else { var newPos = pos / 2; $("body, html").animate({scrollTop:'+=' + newPos + 'px'}, 1000).offset().top; } ``` * not sure if this is the proper solution but it is A solution. Hope it helps * Thread Starter [downfast](https://wordpress.org/support/users/downfast/) * (@downfast) * [11 years, 4 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5617195) * Eventually this is what makes it work. Basically I am calculating the container height each time I load more content and I skip the first time with a simple if statement * ``` if(!jQuery("body").hasClass("loadedList")) { jQuery("body").addClass("loadedList"); } else { var pos = jQuery("#container").height(); $("body, html").animate({scrollTop: pos}, 1000).offset().top; } ``` Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘Window scroll after posts are loaded’ is closed to new replies. * ![](https://ps.w.org/ajax-load-more/assets/icon-256x256.png?rev=2944639) * [Ajax Load More – Infinite Scroll, Load More, & Lazy Load](https://wordpress.org/plugins/ajax-load-more/) * [Frequently Asked Questions](https://wordpress.org/plugins/ajax-load-more/#faq) * [Support Threads](https://wordpress.org/support/plugin/ajax-load-more/) * [Active Topics](https://wordpress.org/support/plugin/ajax-load-more/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/ajax-load-more/unresolved/) * [Reviews](https://wordpress.org/support/plugin/ajax-load-more/reviews/) * 5 replies * 2 participants * Last reply from: [downfast](https://wordpress.org/support/users/downfast/) * Last activity: [11 years, 4 months ago](https://wordpress.org/support/topic/window-scroll-on-posts-loaded/#post-5617195) * Status: not resolved