Css 在Divi Builder中悬停显示视频标题'；s视频滑块

使用Divi视频滑块模块显示一组视频。我们希望在悬停状态下为每个视频显示视频标题。Divi说他们目前不支持这个功能，但说要检查开发社区以获得答案

请参阅上的测试页面。已尝试编辑悬停类，但不起作用

class=“et\u pb\u video\u overlay\u hover”上有一个类，不确定如何使用它来显示WordPress媒体库中的视频标题

---

有没有好的Divi程序员尝试过这一点，或者知道定制CSS或JS解决方案

真正快速的解决方法是在

class=“et\u pb\u video\u overlay\u hover”

上使用

：after

伪元素。您可以将标题放在

内容：

中，如下所示：

.et_pb_video_slider_item_0 .et_pb_video_overlay_hover::after {
    content: "Title";
    // Title will be small, white and centered at the top of 
    // the video. Use other CSS properties to style your titles.
}

第一个视频是

.et\u pb\u video\u slider\u item\u 0

，第二个视频是

.et\u pb\u video\u slider\u item\u 1

等

这是一个可以立即实施的快速解决方案

编辑-我刚刚快速查看了Divi视频滑块模块，看看它是否可以被过滤。您需要的代码位于以下文件中：

/wp-content/themes/Divi/includes/builder/module/Slider.php
/wp-content/themes/Divi/includes/builder/module/SliderItem.php

我尝试使用管理标签为每个视频设置标题，然后将其打印到叠加屏幕上，但在渲染期间无法访问。我确实看到

content\u unprocessed

确实包含标题：

["content_unprocessed":protected]=> string(339) 
"[et_pb_video_slider_item admin_title="Video Title Goes Here" src="https://www.youtube.com/watch?v=FkQuawiGWUw" ... "][/et_pb_video_slider_item]"

但它受到保护，无法从渲染函数中直接访问

---

恐怕这需要一些冗长乏味的编码才能让它正常工作。更简单的解决方案是使用上面的CSS hack，或者简单地将标题嵌入到覆盖图像中。

寻求调试帮助的问题（“为什么此代码不起作用？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现它所需的最短代码。没有明确问题陈述的问题对其他读者没有用处。请参阅：如何创建一个最小的、可重复的示例。您可能会考虑向DIVI用户脸谱网页面提供这类问题。大多数DIVI模块很少支持直接定制或过滤器挂钩-这是一个耻辱。