LightBox problem

LightBox problem

Hi guys i am haing a conflict this works greta in IE but not in fire fox for the lightbox to work.    this has me stumped it is some thing to do with the script above it because when i delete that it works?  any ideas
 
  1.  

    <head>

    <title>Buffalo Web Design | Portfolio</title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta http-equiv="Content-Style-Type" content="text/css" />

    <link href="style.css" rel="stylesheet" type="text/css" />

    <link href="layout.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />

    <script src="js/jquery.js" type="text/javascript"></script>

    <script type="text/javascript" src="js/jquery.galleriffic.js"></script>

    <script type="text/javascript" src="js/jquery.opacityrollover.js"></script>

    <script src="js/cufon-yui.js" type="text/javascript"></script>

    <script src="js/cufon-replace.js" type="text/javascript"></script>

    <script src="js/Calibri_400.font.js" type="text/javascript"></script>

    <script src="js/Myriad_Pro_400.font.js" type="text/javascript"></script>

    <script src="js/Myriad_Pro_700.font.js" type="text/javascript"></script>

    <script type="text/javascript">

    jQuery(document).ready(function($) {

    // We only want these styles applied when javascript is enabled

    $('div.navigation').css({'width' : '915px', 'float' : 'left'});

    $('div.content-gallery').css('display', 'block');

    // Initially set opacity on thumbs and add

    // additional styling for hover effect on thumbs

    var onMouseOutOpacity = 0.67;

    $('#thumbs ul.thumbs li').opacityrollover({

    mouseOutOpacity: onMouseOutOpacity,

    mouseOverOpacity: 1.0,

    fadeSpeed: 'fast',

    exemptionSelector: '.selected'

    });

    // Initialize Advanced Galleriffic Gallery

    var gallery = $('#thumbs').galleriffic({

    delay: 2500,

    numThumbs: 10,

    preloadAhead: 10,

    enableTopPager: true,

    enableBottomPager: true,

    maxPagesToShow: 7,

    imageContainerSel: '#slideshow',

    controlsContainerSel: '#controls',

    captionContainerSel: '#caption',

    loadingContainerSel: '#loading',

    renderSSControls: true,

    renderNavControls: true,

    playLinkText: 'Play Slideshow',

    pauseLinkText: 'Pause Slideshow',

    prevLinkText: 'previous',

    nextLinkText: 'next',

    nextPageLinkText: 'Next &rsaquo;',

    prevPageLinkText: '&lsaquo; Prev',

    enableHistory: false,

    autoStart: false,

    syncTransitions: true,

    defaultTransitionDuration: 900,

    onSlideChange: function(prevIndex, nextIndex) {

    // 'this' refers to the gallery, which is an extension of $('#thumbs')

    this.find('ul.thumbs').children()

    .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()

    .eq(nextIndex).fadeTo('fast', 1.0);

    },

    onPageTransitionOut: function(callback) {

    this.fadeTo('fast', 0.0, callback);

    },

    onPageTransitionIn: function() {

    this.fadeTo('fast', 1.0);

    }

    });

    });

    </script>

    <script src="js/jquery-1.3.2.min.js" type="text/javascript" charset="utf-8"></script>

    <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

    <!--[if lt IE 7]>

    <link href="ie6_style.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="js/ie_png.js"></script>

    <script type="text/javascript">

    ie_png.fix('.png, .carousel-box');

    </script>

    <![endif]-->

    <!--[if IE]>

    <link href="ie_style.css" rel="stylesheet" type="text/css" />

    <![endif]-->

    </head>

  2.  

    <head>

    <title>Buffalo Web Design | Portfolio</title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta http-equiv="Content-Style-Type" content="text/css" />

    <link href="style.css" rel="stylesheet" type="text/css" />

    <link href="layout.css" rel="stylesheet" type="text/css" />

    <link rel="stylesheet" href="prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />

    <script src="js/jquery.js" type="text/javascript"></script>

    <script type="text/javascript" src="js/jquery.galleriffic.js"></script>

    <script type="text/javascript" src="js/jquery.opacityrollover.js"></script>

    <script src="js/cufon-yui.js" type="text/javascript"></script>

    <script src="js/cufon-replace.js" type="text/javascript"></script>

    <script src="js/Calibri_400.font.js" type="text/javascript"></script>

    <script src="js/Myriad_Pro_400.font.js" type="text/javascript"></script>

    <script src="js/Myriad_Pro_700.font.js" type="text/javascript"></script>

    <script type="text/javascript">

    jQuery(document).ready(function($) {

    // We only want these styles applied when javascript is enabled

    $('div.navigation').css({'width' : '915px', 'float' : 'left'});

    $('div.content-gallery').css('display', 'block');

    // Initially set opacity on thumbs and add

    // additional styling for hover effect on thumbs

    var onMouseOutOpacity = 0.67;

    $('#thumbs ul.thumbs li').opacityrollover({

    mouseOutOpacity: onMouseOutOpacity,

    mouseOverOpacity: 1.0,

    fadeSpeed: 'fast',

    exemptionSelector: '.selected'

    });

    // Initialize Advanced Galleriffic Gallery

    var gallery = $('#thumbs').galleriffic({

    delay: 2500,

    numThumbs: 10,

    preloadAhead: 10,

    enableTopPager: true,

    enableBottomPager: true,

    maxPagesToShow: 7,

    imageContainerSel: '#slideshow',

    controlsContainerSel: '#controls',

    captionContainerSel: '#caption',

    loadingContainerSel: '#loading',

    renderSSControls: true,

    renderNavControls: true,

    playLinkText: 'Play Slideshow',

    pauseLinkText: 'Pause Slideshow',

    prevLinkText: 'previous',

    nextLinkText: 'next',

    nextPageLinkText: 'Next &rsaquo;',

    prevPageLinkText: '&lsaquo; Prev',

    enableHistory: false,

    autoStart: false,

    syncTransitions: true,

    defaultTransitionDuration: 900,

    onSlideChange: function(prevIndex, nextIndex) {

    // 'this' refers to the gallery, which is an extension of $('#thumbs')

    this.find('ul.thumbs').children()

    .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()

    .eq(nextIndex).fadeTo('fast', 1.0);

    },

    onPageTransitionOut: function(callback) {

    this.fadeTo('fast', 0.0, callback);

    },

    onPageTransitionIn: function() {

    this.fadeTo('fast', 1.0);

    }

    });

    });

    </script>

    <script src="js/jquery-1.3.2.min.js" type="text/javascript" charset="utf-8"></script>

    <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

    <!--[if lt IE 7]>

    <link href="ie6_style.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="js/ie_png.js"></script>

    <script type="text/javascript">

    ie_png.fix('.png, .carousel-box');

    </script>

    <![endif]-->

    <!--[if IE]>

    <link href="ie_style.css" rel="stylesheet" type="text/css" />

    <![endif]-->

    </head>


 


    • Topic Participants

    • john