如何修改Featherlight画廊箭头提示文字及关闭按钮样式？

1. 替换Featherlight画廊箭头的提示文字 #

不要直接修改压缩后的featherlight.gallery.min.js文件，这种方式维护性差，还容易因浏览器缓存导致修改不生效。正确做法是在初始化Featherlight画廊时，通过配置项指定自定义文本：

$(document).ready(function(){
    $('.gallery').featherlightGallery({
        nextText: 'weiter',
        previousText: 'zurück'
    });
});

如果已有初始化代码，直接在配置对象中添加这两个属性即可。修改完成后，按Ctrl+Shift+R强制刷新浏览器清除缓存，确保加载最新配置。

2. 放大关闭按钮并添加悬停变红效果 #

通过自定义CSS修改关闭按钮样式，将以下代码添加到你的网站样式表中：

/* 放大关闭按钮 */
.featherlight-close-icon {
    font-size: 24px; /* 可根据需求调整尺寸 */
    line-height: 1;
}

/* 鼠标悬停时变为红色 */
.featherlight-close-icon:hover {
    color: #ff0000 !important;
}

如果默认样式优先级较高，可通过更具体的选择器（如.featherlight .featherlight-close-icon）或保留!important来确保自定义样式生效。

内容的提问来源于stack exchange，提问作者Piplupfans