如何使用 jQuery 将活动状态动态添加到图库缩略图

发布于 2024-09-07 13:12:57 字数 376 浏览 4 评论 0原文

我正在使用 galleriffic 来处理我的图片库,但我在缩略图活动状态方面遇到问题。

Galleriffic 不支持图像上的活动状态 - 仅支持列表项。现在,图库将为包含缩略图的当前 LI 分配一个“选定”类,我一直在尝试使用 jQuery 来定位活动 LI 中的缩略图 ID,因此我为图像分配一个活动状态,然后将其返回到默认状态。

本质上我正在做:

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg');

这有效,但是,我无法让图像恢复到默认值。我不认为 jQuery 支持在 if 语句中使用 hasClass,但如果有人知道请帮忙。欢迎任何建议。

I'm using galleriffic to handle my image gallery and I'm having a problem with the thumbnail active states.

Galleriffic doesn't have support for active states on the images - only the list items. Right now the gallery will assign a "selected" class to the current LI containing the thumbnail and I've been trying to use jQuery to target the thumbnail ID within the active LI so I assign an active state to the image and then return it to the default state.

Essentially I'm doing:

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg');

Which works, however, I can't get the image to go back to the default afterward. I don't think there's jQuery support for using hasClass in an if statement, but if someone knows please help out. Any advice is welcomed.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

不喜欢何必死缠烂打 2024-09-14 13:12:57

您可以尝试一下 :not 选择器吗?您当前正在执行此操作以获取选定的图像:

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg');

尝试执行此操作以获取未选定的图像:

$(':not(.selected) img#myImage').attr('src', 'path_to_active_state.jpg');

Could you try the :not selector? You're currently doing this to get the selected image:

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg');

Try doing this to get the unselected image:

$(':not(.selected) img#myImage').attr('src', 'path_to_active_state.jpg');
已下线请稍等 2024-09-14 13:12:57

您可以向活动图像添加一个类,以便稍后可以识别它。

因此

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg').addClass('altered');

,当在示例中突出显示另一个缩略图时

$('.altered').attr('src', 'path_to_inactive_state.jpg').removeClass('altered');

$('.selected img#myImage') 似乎暗示您对所有缩略图使用相同的 ID (#myImage)。 Id 在 DOM 中应该是唯一的。

You could add a class to the active image, so that you can identify it later..

so

$('.selected img#myImage').attr('src', 'path_to_active_state.jpg').addClass('altered');

and when highlighting another thumbnail

$('.altered').attr('src', 'path_to_inactive_state.jpg').removeClass('altered');

also in your example $('.selected img#myImage') seems to imply that you use the same id for all thumbnails (#myImage). Id's should be unique inside the DOM..

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文