投资组合中的灯箱箭头问题（wordpress）

Posted 2023-03-06

【中文标题】投资组合中的灯箱箭头问题（wordpress）

【英文标题】：Problem with the Lightbox arrows in Portfolio (wordpress)

【发布时间】：2020-02-15 08:22:46

【问题描述】：

我正在尝试修改我的灯箱组合。由于我更改了箭头，但现在我需要稍微复杂一些的修改。 检查并点击任何照片：https://iconsmgmt.com/models/

应更改哪些 CSS 代码以使箭头仅在光标位于照片上时出现？

.wppap-img-grp button.slick-prev, .wppap-img-grp button.slick-prev:hover, .wppap-img-grp button.slick-prev:focus 
    right: -10px;
    opacity: 1;

.wppap-img-grp button.slick-next, .wppap-img-grp button.slick-next:hover, .wppap-img-grp button.slick-next:focus 
    left: -10px;
    opacity: 1;

谢谢

【问题讨论】：

您是否编写了 CSS 来告诉它不要显示？你可以更好地使用display:none 和display:block 并使用过渡来淡入。 - w3schools.com/howto/howto_css_transition_hover.asp

【参考方案1】：

试试这个 CSS 而不是你的。

.wppap-img-grp .slick-arrowdisplay:none !important;
.wppap-img-grp:hover .slick-arrowdisplay:block !important;

【讨论】：

是的，我就是这么说的。但是，如果您的代码确实做错了，您应该只需要!important。

@Andrew 因为display: none; 不能正常工作。

@NicoBietti 欢迎不要忘记批准和投票。