如何在WordPress Elementor上将悬停文本添加到基本图库的图像中?

时间:2021-04-27 作者:Vaibhav Sharma

我有一个基本的图片库。我想添加一个标题,该标题仅在将鼠标悬停在库的图像上时可见。

1 个回复
SO网友:Steck Insights Web Design

您的问题没有显示任何代码示例,也没有告诉我您想在标题中显示什么,因此我将省略这些内容并编写自己的代码。

以下是使用jQuery在悬停时显示标题的一种方法:https://jsfiddle.net/steckinsights/yzfpg7n0/25/

现在,使用图库执行此操作意味着您需要做更多的工作(在图像中循环,将图像和标题包装到元素中,为图像和标题添加唯一的ID或类),但这是如何执行此操作的基本答案。

多种方式之一,包括:

将图像设置为BG图像并使用::after CSS元素使用PHP显示注释,并使用jQuery从alt标记中提取注释。请使用许多现成的插件之一进行此操作

相关推荐

是否使WordPress图库(.Gallery-Item)具有响应性?

库的短代码:[gallery link=\"file\" columns=\"5\" size=\"medium\"]我在一个网站的内页上使用了一个5列的图库,显然当该网站对移动设备甚至平板设备做出响应时,图库中的图像会保持默认的样式width: 20%; 看起来太小了。我尝试添加媒体查询样式以增加百分比宽度,但WP仍然应用列类.gallery-columns-5.理想情况下,桌面上有5列图像,平板电脑有3列,移动设备有1列。有谁知道有什么好办法吗?/ ## Gallery -----------