JavaScript - Lightbox Isn't Working

Ok, here's the page as it is right now:
http://www.crackin.com/dev/index.php

The paganation for the top 3 images is Sweet Pages: http://tutorialzine.com/2010/05/swee...tion-solution/
The content loading below is a page-replace script I got he http://css-tricks.com/dynamic-page-replacing-content/
And I'm also trying to integrate shadowbox (or lightbox, whichever will work) into the lower set of images.

I have 2 problems right now I can't figure out, and I'm sure it somehow has to do with the fact I'm trying to mash 3 different JS addons into a single page, I'm still pretty new to this whole JS thing...

First problem I'm having is that IE7 and Opera don't like the links in the upper images. Clicking a gallery image does not load the associated page below from those 2 browsers, however IE8 and FF seem to work fine.

Second problem is getting shadowbox/lightbox to work on those lower images. I tried a couple different things but main thing I did is make sure the script is actually working by setting the header text to a link with shadowbox attached and that worked. That same link doesn't work when applied to the lower images (loads image in new window). Lightbox does the same thing.

Thanks for any help.

When i click on an image, it just opens in a new tab, lightbox doesn't work?!

PHP Code:

    $jq_add_div_strings = '';
    $jq_div_classes_csv = '';
    $counter = 0;

    //startarray

    $bikearray = array();

    //$query  = "SELECT * FROM wmb_members ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage";
    //$query  = "SELECT * FROM wmb_members LEFT JOIN wmb_pics ON wmb_pics.UserID=wmb_members.UserID ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage";
    $query = "SELECT M.*, P.picid, P.filename "
           . " FROM ( SELECT * "
           . "        FROM wmb_members "
           . "        ORDER BY rsDateTaken DESC, UserID ASC "
           . "        LIMIT " . $offset . "," . $rowsPerPage . " ) AS M "
           . " LEFT JOIN wmb_pics AS P "
           . " ON M.UserID = P.UserID "
           . " ORDER BY M.rsDateTaken DESC, M.userID ASC, P.picid ASC;";
    //$query  = "SELECT wmb_members.*, wmb_pics.* FROM wmb_members INNER JOIN wmb_members ON wmb_members.UserID=wmb_pics.UserID ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage";

    $result = mysql_query($query);
    $num_rows = mysql_num_rows($result);
    //echo "DEBUG SQL: " . $query . "<HR>";
    //echo "DEBUG: query returned " . $num_rows . " rows<hr>\n";

    // remember the UserID of the prior row  ... no prior row to start, so blank:
    $priorid = "";

    while ($row = mysql_fetch_assoc($result))
    {
        // get the UserID for the current row in the results
        $curid = $row['UserID'];
        // if not the same as the prior row, then create a new set of data in the bikearray:
        if ( $curid != $priorid )
        {
            // I'm guessing that this stuff goes he
            $jq_add_div_strings .= "animatedcollapse.addDiv('jason$counter', 'hide=1', 'fade=1,height=180px')\n";
            $jq_div_classes_csv .= "'jason$counter',";

            // on firmer footing here...this should be right:
            // store main data array
            $bikearray[$curid]['UserID']        = $curid;
            $bikearray[$curid]['rsBikeman']     = $row['rsBikeman'];
            $bikearray[$curid]['rsBikemod']     = $row['rsBikemod'];
            $bikearray[$curid]['rsBikeyear']    = $row['rsBikeyear'];
            $bikearray[$curid]['rsBikecolor']   = $row['rsBikecolor'];
            $bikearray[$curid]['rsDatetaken']   = $row['rsDatetaken'];
            $bikearray[$curid]['rsLocation']    = $row['rsLocation'];
            $bikearray[$curid]['rsOtherinfo']   = $row['rsOtherinfo'];
            $bikearray[$curid]['rsLocpostcode'] = $row['rsLocpostcode'];
            $bikearray[$curid]['rsLocked']      = $row['rsLocked'];
            $bikearray[$curid]['lockType']      = $row['lockType'];
            $bikearray[$curid]['frontSus']      = $row['frontSus'];
            $bikearray[$curid]['rearSus']       = $row['rearSus'];
            $bikearray[$curid]['frontLight']    = $row['frontLight'];
            $bikearray[$curid]['rearLight']     = $row['rearLight'];
            $bikearray[$curid]['bikeBell']      = $row['bikeBell'];
            $bikearray[$curid]['bikeBasket']    = $row['bikeBasket'];
            $bikearray[$curid]['bikeBag']       = $row['bikeBag'];
            $bikearray[$curid]['rsUser']        = $row['rsUser'];
            $bikearray[$curid]['rsEmail']       = $row['rsEmail'];

            // How do you specify an empty array in PHP??
            $bikearray[$curid]['pictures'] = array();         
            // This is how many pictures there are for current UserID:
            $piccount = 0;

            $counter++;

            // and change priorid for the match test at top of loop
            $priorid = $curid;
        }
        // then regardless if new userid or a repeated userid...
        // see if this record has a valid (non null, non blank) filename:
        $pic = $row['filename'];
        if(!empty($pic))
        {
            // yes...a valid filename...so add it to the array
            $bikearray[$curid]['pictures'][$piccount] = $pic;
            // and count it
            ++$piccount;
        }       
       
    }
    $jq_div_classes_csv = rtrim($jq_div_classes_csv,",");


    $bikearray_html = array();
    $i = 0;

    foreach ($bikearray as $id=>$DETAILS)
    {
        @$bikearray_html[$i] .=  "<div id=\"pubholder\" class=\"wrap\">";
        $bikearray_html[$i] .= "<div class=\"entry_header\">";
        $bikearray_html[$i] .= "<a href=\"javascript:animatedcollapse.show('jason$i')\" >show more details ></a>&nbsp;";
        $bikearray_html[$i] .= "<a href=\"javascript:animatedcollapse.hide('jason$i')\" >hide ^</a>";
        $bikearray_html[$i] .= "<div><b>".$DETAILS['rsUser']."'s ".$DETAILS['rsBikeman']." ".$DETAILS['rsBikemod']."</b> was taken from <b>".$DETAILS['rsLocation']."</b> on <b>".$DETAILS['rsDatetaken']."</b></div>";
        $bikearray_html[$i] .= "<div id=\"jason$i\">\n";
        $bikearray_html[$i] .= "</br></br>";
        $bikearray_html[$i] .= "<b>Owners email:</b> <a href=\"mailto:".$DETAILS['rsEmail']."\"> ".$DETAILS['rsEmail']."</a></br>";
        $bikearray_html[$i] .= "<b>Bike year:</b> ".$DETAILS['rsBikeyear']." </br>";
        $bikearray_html[$i] .= "<b>Bike color:</b> ".$DETAILS['rsBikecolor']." </br>";
        $bikearray_html[$i] .= "<b>Locked:</b> ".$DETAILS['rsLocked']." </br>";
        $bikearray_html[$i] .= "<b>Lock type:</b> ".$DETAILS['lockType']." </br>";

        $bikearray_html[$i] .= "<b>additional extras:</b></br>
        <i> Front suspension: ".$DETAILS['frontSus']."</br>
         Rear suspension: ".$DETAILS['rearSus']."</br>
         Front Light: ".$DETAILS['frontLight']."</br>
         Rear Light: ".$DETAILS['rearLight']."</br>
         Bell: ".$DETAILS['bikeBell']."</br>
         Basket: ".$DETAILS['bikeBasket']."</br>
         Bag: ".$DETAILS['bikeBag']."</i></br>";
          
         
        $bikearray_html[$i] .= "<b>Other info:</b> ".$DETAILS['rsOtherinfo']." </br>";
        if(!empty($DETAILS['pictures'])){
         foreach($DETAILS['pictures'] as $piccount => $pic){
         [B]$bikearray_html[$i] .= "<a href=\"upload/".$pic."\" rel=\"lightbox[bikes]\" border=\"0\"><img src=\"upload/".$pic."\" height=\"75\" width=\"100\" \></a>[/B] &nbsp;";        // do what you want here
         }
    }else{
       // no picture for this user
    }
        $bikearray_html[$i] .= "</br>";
            
        $bikearray_html[$i] .= "</div>\n";
        $bikearray_html[$i] .= "</div>\n";
        $bikearray_html[$i] .= "</div>\n";

        $i++;
    }

    mysql_close($link);
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">

    <head>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
    <title>Stolen Bikes, mountain bikes, bmx bikes, Other cycles and bicycles in the UK</title>
    <meta name="description" content="Website to help people get their stolen bikes back" />
    <meta name="keywords" content="stolen, thief, mountain bike, bicycle, UK, nicked, MTB" />
    <meta name="Content-Language" content="en-gb" />
    <meta name="robots" content="FOLLOW,INDEX" />
    <meta name="revisit-after" content="2 days" />
    <meta name="copyright" content="www.wheresmybike.co.uk" />
    <meta name="author" content="www.mutecms.com - Professional web site design in the south uk, worthing, brighton" />
    <meta name="distribution" content="Global" />
    <meta name="resource-type" content="document" />
            <script type="text/javascript">
            swfobject.registerObject("myId", "9.0.0", "expressInstall.swf");
            </script>
    [B]<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />[/B]
    <link rel="stylesheet" type="text/css" href="css/reset-style.css" />
    <link rel="stylesheet" type="text/css" href="css/sitestyle.css" />
    <link rel="stylesheet" type="text/css" href="css/default.css" />
        <script type="text/javascript" src="javascript/prototype.js"></script>
        <script type="text/javascript" src="javascript/effects.js"></script>
        <script type="text/javascript" src="javascript/lightwindow.js"></script>
        [B]<script type="text/javascript" src="js/swfobject.js"></script>
        <script type="text/javascript" src="js/external.js"></script>
        <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>[/B]
        <script type="text/javascript" src="js/lightbox.js"></script>
        <script type="text/javascript" src="js/jva.js"></script>
        <script type="text/javascript" src="jquery-1.2.2.pack.js"></script>
        <script type="text/javascript" src="animatedcollapse.js"></script>
    <script type="text/javascript">
        animatedcollapse.init()
        <?php echo $jq_add_div_strings; ?>
    </script>
    </head>
    <body>
    <div id="doc">
        <div id="hd">   
            <h1>Where's my bike?</h1>
            <div class="manbike"></div>
            <div class="cctv"></div>
            <ul>
                <li><a href="default.php" title="Homepage and News">home</a></li>
                <li><a href="bike.html" title="Featured Bike">the bike</a></li>
                <li><a href="thieves.html" title="Featured Thief">the thief</a></li>   
                <li><a href="cctv.html" title="CCTV Footage">the CCTV</a></li>
    <li><a href="signup.php" title="Sign Up">sign up</a></li>
                <li><a href="stolen-bikes.php" title="Stolen Bikes">stolen bikes</a></li>
                <li><a href="login.php" title="Login">login</a></li>
                <li><a href="yoursay.php" title="Have your say">your say</a></li>
                <li><a href="forum.html" title="Forum">forum</a></li>
            </ul>
        </div>
        <div id="bd">
            <div class="yui-g">
                <div class="topcontent">
                </div>
                <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
                <a href="javascript:animatedcollapse.show([<?php echo $jq_div_classes_csv; ?>])">show all<img src="images/down.gif" border="0" /></a>
        <a href="javascript:animatedcollapse.hide([<?php echo $jq_div_classes_csv; ?>])"><img src="images/up.gif" border="0" />hide all</a>

                    <?php foreach ($bikearray_html as $html) echo $html; ?>

    <?php echo $first.$prev; ?> Showing page <strong><?php echo $pageNum;?></strong> of <strong><?php echo $maxPage;?></strong> pages <?php echo $next.$last; ?>
            </div>
        </div>
        <div id="ft">Site created by: <a href="http://www.jbiddulph.com">jbiddulph.com</a></div>
    </div>
    </div>
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    try {
    var pageTracker = _gat._getTracker("UA-2434589-16");
    pageTracker._trackPageview();
    } catch(err) {}</script>
    </body>
    </html>

http://www.wheresmybike.co.uk/stolen-bikes.php?page=2

Hi everyone,

My page with my slideshow (with lightbox integrated) is up and running fine on browsers like Firefox, IE, and Google Chrome... But Safari doesn't even show the slideshow.

www.bobbivanstudio.com/work.php

Any ideas why?

Thanks in advance!

Hi,

i have recently just built a simple website and have started to add some added editions one being the lightbox.

i am using dreamweaver cs3 and on a mac laptop, so in safari it works brillaint no problems what so ever.

but as soon as you load it in internet explorer the light box opens but it displays a 404 error on the first image of every gallery, on every different profile?

if anyone would help that would be fantastic

http://www.goodeveningladies.co.uk/profiles.co.uk

Code:

<a href="../images/lrgimages/adam/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <img src="../images/Adam.jpg" alt="" width="450" height="200" align="middle" />
        <a href="../images/lrgimages/adam/1.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <a href="../images/lrgimages/adam/2.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <a href="../images/lrgimages/adam/3.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <a href="../images/lrgimages/adam/4.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <a href="../images/lrgimages/adam/5.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]">
        <a href="../images/lrgimages/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"></a>

here is a section of the coding that i use for each image obviously the names have changed and the directories have changed for each profile.

any help would be much appreciated.

http://www.fotoderyadijital.somee.co...cekimleri.html


why my gallery is too slow when i double click the image
is it about lightbox script or images is too big size.
can you check for me.