ansaurus

Question

Creating a pop-in window effect with hashtags

Answer 1

A:

You will need to either make a function to call or use window.location or something to that effect to get what you want. Your jQuery code only runs right after the page is loaded, and just clicking those links does not reload the page.

Badger 2010-06-29 21:37:38

Answer 2

A:

Your script is only going to run when the page first loads. When clicking on anchor that contains a hash fragment, the page will not reload, so your script in $(document).ready... will not run again.

I think you want to add the jQuery Hashchange event plugin: http://benalman.com/projects/jquery-hashchange-plugin/

Then you can bind actions to the hashchange event, which will execute a callback when the user changes the hash fragment by clicking your links. Your script will end up looking something like:

$(window).bind('hashchange', function() {
 pageCaller();
});

function pageCaller() {
 var loc = window.location.hash;
 var container = $('.container');
 if ( loc == "#content1" ) { $('.container').load('content1.html') }
 if ( loc == "#content2" ) { $('.container').load('content2.html') }
}

pageCaller();

hundredwatt 2010-06-29 21:39:42

Thanks, that totally worked! (I posted a condensed version using a function to make it cleaner in a comment to myself.)

Marc P 2010-06-29 22:04:11

Edited mine to include your DRYer code. Glad I could help!

hundredwatt 2010-06-29 23:19:19

Answer 3

A:

Thanks @hundredwatt, the plugin totally worked! I condensed the code further with some function() action:

$(window).bind('hashchange', function() {
 pageCaller();
});

function pageCaller() {
 var loc = window.location.hash;
 var container = $('.container');
 if ( loc == "#content1" ) { $('.container').load('content1.html') }
 if ( loc == "#content2" ) { $('.container').load('content2.html') }
}

pageCaller();

Marc P 2010-06-29 22:05:07

ansaurus

tags:

views:

answers:

Creating a pop-in window effect with hashtags

related questions