[英]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...还有我的 html/php...
function portfolio() {
$sql = "SELECT * FROM db ORDER BY id DESC";
$res = mysql_query($sql) or die(mysql_error());
while($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).顺便说一句,您不应该有多个具有相同 id 的元素(所有 div 都具有“大图像”作为 id)。
I think your jQuery should look like this:我认为您的 jQuery 应该如下所示:
$(".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.如果这不起作用,请检查 $row['name'] 是否是您期望的字符串。
Yeap, strictly speaking, each HTML element should ideally has a unique ID.是的,严格来说,每个 HTML 元素理想情况下都应该有一个唯一的 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.您可能可以为 ID 添加一个计数器,因此名称将是“large-image-1”、“large-image-2”等,当然,也可以为 JavaScript/jQuery function 传递计数器。
Cheers.干杯。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.