The two scripts have no obvious way of working together. We could easily add the functionality of Thumbnail Viewer II to PHP Photo without using the thumbnailviewer2.js script.
Put this (along with but separate from the standard stuff for PHP Photo) in the head of your page:
Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
(function($){
$('.photodiv img').live('mouseover', function(){
$('#loadarea').empty().append('<img style="display: none;" src="' + this.src + '" alt="" />');
$('#loadarea img').fadeIn('slow');
});
})(jQuery);
</script>
Add a loadarea div somewhere in the body of the page, example:
Code:
<div id="loadarea" style="width: 600px; height: 500px;"></div>
You would probably also want to disable the native thumbnailviewer function, but this is not required. To do so comment out the line as shown:
Code:
<script type="text/javascript">
new phpimagealbum({
albumvar: jaguar, //ID of photo album to display (based on getpics.php?id=xxx)
dimensions: [3,2],
sortby: ["file", "desc"], //["file" or "date", "asc" or "desc"]
autodesc: "Photo %i", //Auto add a description beneath each picture? (use keyword %i for image position, %d for image date)
showsourceorder: true, //Show source order of each picture? (helpful during set up stage)
onphotoclick:function(thumbref, thumbindex, thumbfilename){
//thumbnailviewer.loadimage(thumbref.src, "fit2screen")
}
})
</script>
Bookmarks