jQuery Forum

Here is an example....

Given...
<div class="photos"></div>
<div class="links"><a href="a.html">Photo Set</a></div>

jQuery...

$('.links a').click(function(e) {
      e.preventDefault(); // keep link from working normally
      var thisHREF = $(this).attr('href'); // put a.html in a variable
      $('.photos').load(thisHREF); // load a.html into the div with a class of photos
});

http://api.jquery.com/click/
http://api.jquery.com/attr/
http://api.jquery.com/load/

Dear Jay,

Thank you for your help!

I would like to clarify if the <div class="links"> is supposed to be the navigation bar?

Hi everyone,

I found a similar question here: https://forum.jquery.com/topic/loading-and-replacing-layers-with-ajax#14737000003104185

Can I ask what's the difference with the code in the above link and the code in this thread? Because I'm trying to achieve the same effect as the question mentioned in the above link...

Thankyou for your help!

Hi all,

Maybe I should ask...

What should my jQuery script be if I want to create the same photo gallery as this? http://christopherandersonphoto.com/

Thankyou again!

Great great...

Thanks again...

Dear Jay,

I still have difficulties with the building block code that you gave me. I'm not sure what other codes need to be added.

Basically, I've been trying to create a photography portfolio.

1. One set of photos will be displayed at the homepage
2. When I click on a link on the nav bar, a new set of photos will replace the existing set
3. When I click on another link on the nav bar, a new set of photos will again replace the existing set.

What else should I do?

Sorry, I'm pretty new at jQuery...

Show us what you have built so far.

I tried to use the codes I found here: https://forum.jquery.com/topic/loading-and-replacing-layers-with-ajax#14737000003104185

And this is my site...

http://40studios.com/Sean/index.html