modified: script.js

modified:   styles.css
This commit is contained in:
IrisVega 2024-07-09 16:09:11 +08:00
parent 19ad050266
commit 65c6da69f6
2 changed files with 10 additions and 3 deletions

View File

@ -19,6 +19,7 @@ $(document).ready(function() {
// 设置当前按钮为活动状态 // 设置当前按钮为活动状态
$(this).addClass("active"); $(this).addClass("active");
updateContentOpacity($("#mySlider").val());
}); });
// 添加新选项卡 // 添加新选项卡
@ -32,10 +33,13 @@ $(document).ready(function() {
<img style="max-width:100%;overflow:hidden;" src="./jpg/${$(".tablinks").length}.jpg" alt="第${$(".tablinks").length}张照片"> <img style="max-width:100%;overflow:hidden;" src="./jpg/${$(".tablinks").length}.jpg" alt="第${$(".tablinks").length}张照片">
</div> </div>
`; `;
$(".tab").find(".addTab").before(newTabButton); $(".tab").find(".addTab").before(newTabButton);
$("body").append(newTabContent); $("body").append(newTabContent);
// 绑定新添加的选项卡按钮和删除按钮的事件 // 绑定新添加的选项卡按钮和删除按钮的事件
// $(".tabcontent").hide();
// $("#" + newTabId).show();
// $(".tablinks").removeClass("active");
// $(`.tablinks[data-tab="${newTabId}"]`).addClass("active");
bindTabEvents(); bindTabEvents();
updateContentOpacity(slider.val()); updateContentOpacity(slider.val());
}); });
@ -65,6 +69,7 @@ $(document).ready(function() {
$("#" + $(".tablinks").first().data("tab")).show(); $("#" + $(".tablinks").first().data("tab")).show();
} }
} }
updateContentOpacity($("#mySlider").val());
}); });
// 绑定选项卡按钮和删除按钮的事件 // 绑定选项卡按钮和删除按钮的事件
@ -83,6 +88,7 @@ $(document).ready(function() {
// 设置当前按钮为活动状态 // 设置当前按钮为活动状态
$(this).addClass("active"); $(this).addClass("active");
updateContentOpacity($("#mySlider").val());
}); });
$(".removeTab").off("click").click(function() { $(".removeTab").off("click").click(function() {
@ -110,6 +116,7 @@ $(document).ready(function() {
$("#" + $(".tablinks").first().data("tab")).show(); $("#" + $(".tablinks").first().data("tab")).show();
} }
} }
updateContentOpacity($("#mySlider").val());
}); });
} }
// 初始绑定事件 // 初始绑定事件

View File

@ -49,9 +49,9 @@
text-align: center; /* 使&ldquo;日期&rdquo;居中显示 */ text-align: center; /* 使&ldquo;日期&rdquo;居中显示 */
display: none; display: none;
padding: 6px 12px; padding: 6px 12px;
border: 1px solid #ff69b4; /* 粉色边框 */ border: 1px solid rgba(255, 255, 255, 0); /* 粉色边框 */
border-top: none; border-top: none;
background-color: rgba(255, 255, 255, var(--content-opacity)); /* 白色背景 */ background-color: rgba(255, 255, 255, 0); /* 白色背景 */
} }
/* 删除按钮样式 */ /* 删除按钮样式 */