mwbarry Posted September 4, 2011 Share Posted September 4, 2011 I'm writing some jquery such that when the user hovers over an image, the image shakes. In the page, I use ajax to load new content when the user clicks the nav bar that replaces the images on the home page. The images are on the front of the index page in the site and the animations work great. However, once the user navigates away from the home page and then back again in which the home page content is reloaded with ajax, the animations stop working. Any idea why the jquery stops working?html <table width="100%" border="0"> <tr> <td align="center"><a href="http://www.smartlifeapp.com" class="app" id="sl"><img src="images/SL.png" alt="smartlife" height="166px" /></a><div class="appname">Smart Life!</div> </td> <td align="center"><a href="http://itunes.apple.com/us/app/drinkdeals/id444605503?mt=8" class="app" id="dd"><img src="images/DD.png" alt="drink deals" height="166px" /></a><div class="appname">Drink Deals!</div> </td> </tr></table> xml loaded from ajax <table width="100%" border="0" valign="top"> <tr> <td align="center"><a href="http://www.smartlifeapp.com" class="app" id="sl"><img src="images/SL.png" alt="smartlife" height="166px" /></a><div class="appname">Smart Life!</div> </td> <td align="center"><a href="http://itunes.apple.com/us/app/drinkdeals/id444605503?mt=8" class="app" id="dd"><img src="images/DD.png" alt="drink deals" height="166px" /></a><div class="appname">Drink Deals!</div> </td> </tr></table> jquery animation <script type="text/javascript"> $(jiggle); function jiggle () { $(".app").hover( function () { $(this).animate({top:"-10px"},300).animate({right:"10px"},100).animate({right:"-20px"},100).animate({right:"16px"},100).animate({right:"-12px"},100).animate({right:"8px"},100).animate({right:"-4px"},100).animate({right:"0px"},100); }, function () { $(this).animate({top:"0px"},300).animate({right:"0px"},100); } ) }</script> Link to comment Share on other sites More sharing options...
justsomeguy Posted September 5, 2011 Share Posted September 5, 2011 You need to run the code again to set the event handlers when you replace the content. The new elements don't have the old event handlers on them. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.