greenace92 Posted October 31, 2015 Share Posted October 31, 2015 This site qz.com uses this I'm not sure if it is called infinite scroll. The url changes after the slash to me this seems like changing directories but the page does not reload... I imagine this could be linked with AJAX and probably Javascript or jQuery. Is that what is going on? Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/ Share on other sites More sharing options...
Jacques1 Posted October 31, 2015 Share Posted October 31, 2015 I couldn't reproduce the behaviour you describe, but this sounds like the History API. Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1524970 Share on other sites More sharing options...
greenace92 Posted November 1, 2015 Author Share Posted November 1, 2015 (edited) Hi Jacques1, Thanks for your responses as always. To illustrate what I was talking about above, going from the first link here: http://qz.com/537093/africas-democracies-need-to-reconcile-with-term-limits-and-not-just-to-keep-the-west-happy/ Then as you scroll down, the link suddenly switches to: http://qz.com/537868/the-worlds-first-urine-malaria-test-could-save-thousands-of-lives-in-nigeria-and-beyond/ and then: http://qz.com/538237/ordinary-angolans-are-asking-where-did-all-the-oil-riches-go/ and so on... Every time there is a content divider, the url changes and the scrolling seems "infinite" as the scrollbar distance does not end. But as I said the page is not refreshed, but the url changes and it seems like you are accessing different directories simultaneously as shown by the changing url. Actually it does appear to refresh, but quite quickly where it appears to be continuous. The favicon logo briefly switches to a refreshing symbol and then returns to the Q logo so I guess it is refreshing? Edited November 1, 2015 by greenace92 Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525078 Share on other sites More sharing options...
Jacques1 Posted November 1, 2015 Share Posted November 1, 2015 No, it's not a refresh. If you open the developer tools of your browser, you'll see an Ajax request whenever new content needs to be loaded. Have you looked into the history API I mentioned above? Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525082 Share on other sites More sharing options...
greenace92 Posted November 1, 2015 Author Share Posted November 1, 2015 (edited) I briefly looked at it, saw some were obsolete and wasn't sure how "...browser session history..." applied. What are these methods for? Javascript? This is not huge on my list of things to implement/do but I was curious as to the driving mechanism like how it was accomplished. It's nice not having to keep going to new locations for new content. I have a scrolling project in mind that would use the same idea, loading "blocks" so to speak and adding them to the scroll feed and I could imagine how it may implement something like this. Good point about using the developer console. I hate to think like "stealing" or "copying" an idea by looking at the code... but I guess in some way or another you're going to do that regardless as I'm not the first person to develop these technologies that many people use. I try to figure things out on my own or just blatantly ask how something is done or a hint. Thanks for your input, I appreciate it. Edited November 1, 2015 by greenace92 Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525083 Share on other sites More sharing options...
Jacques1 Posted November 1, 2015 Share Posted November 1, 2015 The History API is the standard method for dynamically updating the URL with JavaScript. It's not obsolete in any way, and it's nothing special either. 1 Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525091 Share on other sites More sharing options...
greenace92 Posted November 1, 2015 Author Share Posted November 1, 2015 Alright well then this seems to be what I was looking for. I was referring to History.current, History.next, and History.previous there is an obsolete sign next to them. I will get back to this post when I actually implement but I'm glad to have found more information about it thanks to your link and posts. Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525100 Share on other sites More sharing options...
QuickOldCar Posted November 6, 2015 Share Posted November 6, 2015 You should know is not very good for bookmarking or search engines. Unless you absolutely need to load dynamic content should not do this, instead use a paginated number system and single reference pages. Is a lot of people that disable js, don't rely on it. My biggest gripe is trying to see beyond a pile of content already seen using the "infinite" type loaders. You can just go to say page 20 of wanted to. Some sites you go to are loading a pile images for each one, by the time you click a pile of times now have one extremely large page using lots of bandwidth and memory. Reminds me of old single page blogger sites. Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1525858 Share on other sites More sharing options...
greenace92 Posted November 11, 2015 Author Share Posted November 11, 2015 Can you accomplish both by paginating separately and then using one viewing page? So the indexing/seo is not affected by the viewer as they are separate, the viewer just pulls files to be viewed. Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1526182 Share on other sites More sharing options...
QuickOldCar Posted November 11, 2015 Share Posted November 11, 2015 The index view would be the limited list of content and linking to a href each one either by it's id or "safe for urls" post slug The pagination of that is different entirely where page 1 would be a limit of say 0-19 records, then each +1 increment page number is +20 records You could do pagination for single post pages too if wanted to split huge data or is a multiple part data. Such as you saying including their files. You should just rely on the id of the record and add the title sanitized at the end just for seo purposes, the title portion would never be required and extra at the end. If you save posts as sanitized slugs in a database can make single pages linked directly to that. Trust me is better off linking to an id, especially same multiple titles and if need to edit those titles in the future changes the location. Using an autoincrement id will ensure are seeing only that record. Do all the processing up top. Determine if is a single page or the index. Perform your query up top so can use that same returned data for seo and also later on for any checking and also the html content. Inject the opengraph and meta data in the head section of the html If a url contains something specific to identify a single page you include either a different script or is coded in the same script using if/else or a switch Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1526213 Share on other sites More sharing options...
greenace92 Posted November 11, 2015 Author Share Posted November 11, 2015 I have to go over your response in more depth. Not sure if I follow "up top" when you say that. Quote Link to comment https://forums.phpfreaks.com/topic/298960-what-is-happening-when-you-scroll-through-a-website-and-the-url-changes/#findComment-1526243 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.