I have attempted to implement suckerfish hoverlightbox on this site.

The idea behind the script is that it loads a set of thumbnails in a dropdown and then the user can click on them (and voila: the lightbox effect shows the photos full size). It works fine in IE7 and Firefox (you mouse over the text on the red button where it says "view photos" and the thumbnail menu drops down) but this dropdown does not work in IE6. There is a conditional js script included in my html that should activate a script for IE versions less than or equal to IE7:



PHP Code:
<!--[if lte IE 7]> 
    <
script src="suckerfish/js/navigation.js" type="text/javascript"></script> 
  <![endif]--> 


and it works fine on the demo example page in IE6, but does not work on my page (I'm guessing due to being combined with some other factor on my page?) Note that I have switched in slimbox instead of lightbox (as used in the demo) as lightbox was not behaving for me either.

I'm guessing the problem is somewhere in the combination of the scripts I have running?




PHP Code:
<head
<
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"

        <
title>Higher Education Projects</title
        <
script type="text/javascript" src="p7exp.js"></script> 

        <link href="brinjac.css" type="text/css" rel="stylesheet"/> 
        <script type="text/javascript" src="slimmerbox/mootools.v1.1.js"></script> 

<link href="slimmerbox/slimbox_ex.css" type="text/css" rel="stylesheet"/> 
<script type="text/javascript" src="slimmerbox/lib.js"></script> 
<script type="text/javascript" src="slimmerbox/slimbox_ex.js"></script> 

<!-- Suckerfish HoverLightbox Redux --> 
  <link rel="stylesheet" href="suckerfish/lightbox/css/lightbox.css" type="text/css" media="screen,projection" /> 
  <link rel="stylesheet" href="suckerfish/css/gallery.css" type="text/css" media="screen,projection" /> 
  <script src="suckerfish/lightbox/js/lightbox.js" type="text/javascript"></script> 
  <!--[if lte IE 7]> 
    <script src="suckerfish/js/navigation.js" type="text/javascript"></script> 
  <![endif]--> 

</head> 

Any help is much appreciated. thank you.