Question

Let’s say you have a page like facebook.
You have a certain group page or a company page that has navigation links such as: Information, Events, Photos.

I would like to create a standard layout which has a left navigation and a right content holder. By clicking on any of the three left navigation buttons the content on the right is fetched via jquery. The default page loaded would always be information.

However, what would I do when I want to link to this group, but open the photos page first? And if I have many of these groups, what would be the most effective way of doing this?

Thanks 🙂

Answer 1

If I understand what you’re asking for, you could do this with the hash portion of the URL (the part after the # character). Your URLs would be http://example.com/somepage#Information, http://example.com/somepage#Events and http://example.com/somepage#Photos. When the browser requests one of these, the hash portion isn’t sent to the server; it has to be handled at the client with code to look for a hash and take action on it.

It sounds like your page will already have client script on the navigation links to open up the information, photos, or events in a dialog or lightbox when those links are clicked. So after wiring that up, look at the hash portion. If it corresponds to #Photos, auto-open the photos lightbox, and so forth.

This has the advantage of being bookmarkable and shareable. I recently did this on a page with multiple videos. jQuery finds all the links that correspond to videos (using a class name), and turns them into video-dialog openers. When there’s a hash on the URL that corresponds to a video, I open the dialog up automatically. Each video can be individually shared on social networking sites.