At the moment I am using jquery.ba-hashchange.min.js and dynamicpage.js to load the content dynamically from the index page and therefore keeping the header in one file. However, the jquery.ba-hashchange.min.js is interfering with other jQuery in my content.

The code in the content that is not working is as follows:

$(".thumbnails").on("mouseover mouseout", 'img', function () { 
 
var alt = $(this).attr('alt'); 
 $
('.displayed-image > img').each(function(index, element) { 
 
var el = $(element), 
 visibility 
= el.attr('alt') === alt ? 'visible' : 'hidden'; 
 el
.css('visibility', visibility); 
 
}); 
});

This code makes hidden images visible when the user hovers over the thumbnails. You can see this working here http://intelligen.info/instagram-randoms.html

However if you navigate to this content using the menu at the top of the index page herehttp://intelligen.info Personal > Instagram Randoms , the code is not working. Can anyone tell me how to make the code work with the menu?