开发者

Help with jquery image gallery

I am creating a portfolio image gallery for my website but I'm having some trouble... When I click on one of the icons the first image goes away (thats suppose to happen) but the next image won't open...

Heres my code:

$(".portlink").click(function() {
    $(".large-image").addClass("hidden");

    var $alt = $(this).attr("alt");

    $(".", $alt).removeClass("hidden");
})

And my html/php...

    function portfolio() {
    $sql = "SELECT * FROM db ORDER BY id DESC";
    $res = mysql_query($sql) or die(mysql_error());

    whi开发者_Python百科le($row = mysql_fetch_assoc($res)) {
    ?>

        <div id="large-image" class="<?php echo $row['name'] ?> large-image hidden">
            <a href="<?php echo $row['website_address'] ?>"><img src="img/uploads/<?php echo $row['website_image'] ?>" alt="" /></a>
        </div>
    <?php
    }
} // End portfolio

function portfolio_nav() {
    $sql = "SELECT * FROM db ORDER BY id DESC";
    $res = mysql_query($sql) or die(mysql_error());

    while($row = mysql_fetch_assoc($res)) {
    ?>
        <div class="workbox"> 
            <div class="background pngfix"> 
                 <a class="portlink" alt="<?php echo $row['name'] ?>" href="#"><img src="img/uploads/<?php echo $row['website_image'] ?>" alt="" /></a>
            </div>  
        </div> 
    <?php
    }
} // End portfolio

please help!!

Thanks Ben


Just as a side note, you shouldn't have multiple elements with the same id (all your divs have "large-image" as the id).

I think your jQuery should look like this:

$(".portlink").click(function() {
    $(".large-image").addClass("hidden");

    var alt = $(this).attr("alt");

    $("." + alt).removeClass("hidden");
})

(used a '+' instead of ',' in last line).

If that doesn't work check that $row['name'] is a string as you expect.


Yeap, strictly speaking, each HTML element should ideally has a unique ID.

You can probably add a counter for the ID, so the name would be "large-image-1", "large-image-2", etc, and of course, passing the counter as well for the JavaScript/jQuery function.

Cheers.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜