Fancybox: link that changes the url in address bar and links to a page with an open Fancybox

Question

Basically, what I need is to get the fancybox links to change the url in the address bar to something like this: www.website.com/page/#lightbox

Also

Answer 1

The trick is to make a single function for displaying the content you want, based on some hashtag. The simplest way to do that is make the value of the hashtag also the ID of some element on the page you want to display in fancybox (although by no means required).

Then, just use the hashtags for your link hrefs, and do not use jQuery's preventDefault() function on those links. That way, those links will alter the url bar, appending the hash tag that you set as their href values. Then, attach the function to display the fancybox to those links.

Finally, call that function with the value of location.hash as your argument.

Just whipped this up as a simple example. Seems to do what you want it to.

    
    
    
    
    
    
    



    

        Show 1
    
    

        Show 2
    

    
This is a test
    
This is another test