The second demo (odysseypic.html) is missing jQuery, which is required by the newer version of the script. As a result it doesn't work in any browser. Add the highlighted as shown:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>"Odyssey" Series</title>
<link rel="stylesheet" href="thumbnailviewer.css" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="thumbnailviewer2new.js">
/***********************************************
* Image Thumbnail Viewer II script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/
</script>
<style type="text/css">
<!--
body {
background-color: # . . .
After adding that it should work fine in IE 10 as well as others.
The browser cache may need to be cleared and/or the page refreshed to see changes.
Note: The way the second demo is currently setup, once working the viewer will be activated onmouseover, not click. In fact, if you do click, it will take you directly to the image. This can be overridden such that it won't happen by adding this code after the thumbnail script's external tag:
Code:
<script type="text/javascript">
jQuery(function($){
$('a[rel="enlargeimage"]').click(function(e){
e.preventDefault();
});
});
</script>
Or one can simply add the trigger:click property/value pair to the rel attributes of the trigger links to have them activate on click.
Bookmarks