jquery ajax + inline Javascript

hopefully this will be an easy fix..

I use this script to load content into a Div wih Ajax...

$(document).ready(function() {



$('.top_nav a').click(function(){

  var toLoad = $(this).attr('href')+' .content';
  $('.content').hide('slow',loadContent);
  $('#load').remove();
  $('#header_resize').append('<span id="load">Please wait</span>');
  $('#load').fadeIn('normal');
  window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
  function loadContent() {


   $('.content').load(toLoad,showNewContent())

   }
  function showNewContent() {

   $('.content').show('normal',hideLoader());


  }
  function hideLoader() 开发者_如何学Python{
   $('#load').fadeOut('normal');
  }
  return false;

 });

});

This works great! :)

I also would like to use a Fancybox plugin on images that will be loaded into the div.

So I've added this to my index.php -

$("a#example6").fancybox({
      'titlePosition' : 'over'});

So basically I assumed that when my photo with an ID of #example6 got loaded into my page with ajax, it would automatically hook-up with the code above...

It doesn't! I'm assuming this is because the .fancybox call only works on things that are in the original DOM... How do I make it listen for all future #example6's and fire the plugin accordingly.

Having real trouble with this one, and would appreciate any help.

Thanks

Shane.

Try putting the call that assigns the fancybox plugin to #example6 inside the callback function of the AJAX load :)

Also, it will help us help you if you could use the button in the editor that looks like a square of binary code to make sure your code appears correctly. Thanks :)