I'm creating the effect that when I scroll my document to the bottom watching a set of post and get the last one, I start loading new posts in the same way as facebook does in the wall.
Well, the effect is not the same.
In facebook, when new content is loaded, the position in the document only scroll up a little bit to see that new content is ready but in the mine the effect differ. Sometimes it scroll down and other to the middle, etc...
Does anyone know any technic I could use?
Thanks.
you can do it with masonry infinite scroll
and also with Infinite Scroll by Paul Irish
Yes you can do it using simple php and jquery trick. See HERE
Related
Hi if someone could help I would really grateful. I am using the Woohoo wordpress news theme. What I would like to do is when a user clicks to a post that they can just scroll to the next post as well as the url changing when the next posts is scrolled to. I have struggled to find a suitable plugin. The one I found is called smart scroll which does what is supposed to, which is add infinite scroll and it changes the url when in the single post, seen here (https://wordpress.org/plugins/smart-scroll-posts/). The issues I am having with that is, when I navigate back to the home page all the posts do not display until I refresh the page. Currently I have a standard infinite scroll plugin doing the scrolling but would like to add the url change in as well.
If Someone has come across the issue before and found a fix or even a better way to do this I would be grateful for some help. Thanks
So basically I need something similar that twitter has - when user scrolls down to the bottom of the page, new information from database automatically loads. Any suggestions how to create it or any examples? I know it can be done with AJAX, but could you please show a example, or a sample code?
It is called Infinite Scrolling (or Endless Scrolling). I think the most widespread solution is using Paul Irish's Infinite Scroll jQuery plugin. Also, you can find related information, documentation and demos in the Infinite Scroll page.
I'm stuck with a div that is in one position while the page loads, and in another position as the page finishes loading. I've spent nearly all afternoon on this one little thing, and cannot seem to grasp why this is happening.
I am using wordpress, so there are plenty of different conditional tags for different templates but I can't see the problem in the template files. The div that seems to be giving me the hard time is the container. I changed the background color of the container on the template that I'm stuck on, so I can see what its doing while the page loads, and it looks to me like once the page is loads 45px of either margin-top or padding-top are being applied to the container.
Does anyone have any ideas? I've gone through conditional tags, and my style sheets and I just don't get why its behaving the way it is. Any help would be greatly appreciated.
It's taken me a couple of page refreshes but I think I can see your problem:
There is this particular DIV: class="entry-image-container" that is loaded into the page despite not being required and is causing your drop down as this element seems to be loading via Opacity in the DOM ....
If you hit F12 and open up the entry-image-container tag, hit refresh on the page you will notice that the entry-image-container is loaded through Opacity and seems to be causing a delay in loading (i'd have posted an image but StackOverflow says im not of higher enough rep yet)
Perhaps including a conditional statement for this tag would resolve the issue for you?
I hope this has helped in some way - Using Chrome on Mac OSX
The header has a 44px padding (22px 0 44px).
For me (current stable FF, Win7) nothing is moving.
Why Google Chrome scroll down to end of the page when page is refreshed grammatically or by F5 Key. It is working fine on other browsers.
I am using php, Symfony JavaScript, jQuery and some jQuery plugins on Page.
Any Idea ???
Thanks
It doesn't act any differently to other browsers, as far as I am aware - it will scroll to the point the page was at when it was refreshed. Does the page have a #reference after the URL (ie. http://www.url.com/index.htm#thisbit )?
Chrome just like many browsers tries to scroll to the last position you were before hitting F5.
It should not scroll on its own but maybe something within your page confuses it, like a frame or so.
Maybe also make a complete refresh using ctrl+F5 once.
For more detailed help you should supply a live example or something similar that reproduces your issue.
I would like to create a more button similar to facebook that loads more items on the wall.
Could someone please advice on how I could get this working in PHP. Could you please point me to a resource or let me know a way how I can acheive this.
I think what you seek is called an infinite scroller.
Check out this tutorial on how to create an infinite scrolling gallery on PHP. This one doesn't have the "more" button, it loads more content automatically every time you scroll the page down to the bottom. But it's easy enough to adapt it to work with a "more" button.
Edit: here's another tutorial, this time with the button.