Over on blogdowntown (as well as here) I use a little bit of Javascript to allow longer posts to start out collapsed, but give the user the ability to expand the body in place as desired. It's old code, from well before I knew anything of AJAX.
When a post is expanded or collapsed, an anchor name is added to the end of the URL, using the post ID as a key. This lets the browser scroll to the appropriate spot so that the post that was clicked is the one visible. So if the user clicks to expand post '2475,' the end of the URL will now read '/#2475.'
Simple enough.
Occasionally, though, someone links to that URL instead of using the permanent link for the post (which, using this example, would be '/blog/2475'). That works fine while while the post is on the front page, but after a few more posts go up that content is no longer anywhere to be found.
Thursday LA Observed linked to a post using the # syntax. In light of that, I was a little cautious about when I let the linked post fall out of the first five. Today, though, I had something new ready to go and needed a solution.
What I did was add a little Javascript to the main page for blogdowntown that checks for # syntax in the browser location. If it sees a #id, but doesn't see that id in the page, it loads the post and sticks it after the five posts that would normally be there. It then tells the browser to scroll down to the newly loaded content.
And best of all, it was easy. Javascript after the jump...
Continue Reading...
