取消按钮
This commit is contained in:
parent
057c6e5704
commit
c518cb9226
|
@ -79,40 +79,41 @@ export default function Photos({
|
|||
}, 400);
|
||||
|
||||
// 添加左右切换按钮
|
||||
const btns = document.createElement("div");
|
||||
btns.className = "imagesBtnsControllers";
|
||||
const btnL = document.createElement("div");
|
||||
btnL.className = "imagesBtnsControllerLeft";
|
||||
btnL.addEventListener("click", () => {
|
||||
if (currentIndex.current > 0) {
|
||||
currentIndex.current = currentIndex.current - 1;
|
||||
handleShowImages(currentIndex.current, photos, btns,interval);
|
||||
if (!currentIndex.current) {
|
||||
btnL.style.opacity = 0.5;
|
||||
btnR.style.opacity = 1;
|
||||
} else {
|
||||
btnR.style.opacity = 1;
|
||||
btnL.style.opacity = 1;
|
||||
}
|
||||
}
|
||||
});
|
||||
const btnR = document.createElement("div");
|
||||
btnR.className = "imagesBtnsControllerRight";
|
||||
btnR.addEventListener("click", () => {
|
||||
if (currentIndex.current < currentPhotos.length - 1) {
|
||||
currentIndex.current = currentIndex.current + 1;
|
||||
handleShowImages(currentIndex.current, photos, btns,interval);
|
||||
if (currentIndex.current == currentPhotos.length - 1) {
|
||||
btnR.style.opacity = 0.5;
|
||||
btnL.style.opacity = 1;
|
||||
} else {
|
||||
btnR.style.opacity = 1;
|
||||
btnL.style.opacity = 1;
|
||||
}
|
||||
}
|
||||
});
|
||||
btns.append(btnL, btnR);
|
||||
handleShowImages(index, photos, btns,interval);
|
||||
// const btns = document.createElement("div");
|
||||
// btns.className = "imagesBtnsControllers";
|
||||
// const btnL = document.createElement("div");
|
||||
// btnL.className = "imagesBtnsControllerLeft";
|
||||
// btnL.addEventListener("click", () => {
|
||||
// if (currentIndex.current > 0) {
|
||||
// currentIndex.current = currentIndex.current - 1;
|
||||
// handleShowImages(currentIndex.current, photos, btns,interval);
|
||||
// if (!currentIndex.current) {
|
||||
// btnL.style.opacity = 0.5;
|
||||
// btnR.style.opacity = 1;
|
||||
// } else {
|
||||
// btnR.style.opacity = 1;
|
||||
// btnL.style.opacity = 1;
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// const btnR = document.createElement("div");
|
||||
// btnR.className = "imagesBtnsControllerRight";
|
||||
// btnR.addEventListener("click", () => {
|
||||
// if (currentIndex.current < currentPhotos.length - 1) {
|
||||
// currentIndex.current = currentIndex.current + 1;
|
||||
// handleShowImages(currentIndex.current, photos, btns,interval);
|
||||
// if (currentIndex.current == currentPhotos.length - 1) {
|
||||
// btnR.style.opacity = 0.5;
|
||||
// btnL.style.opacity = 1;
|
||||
// } else {
|
||||
// btnR.style.opacity = 1;
|
||||
// btnL.style.opacity = 1;
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// btns.append(btnL, btnR);
|
||||
// handleShowImages(index, photos, btns,interval);
|
||||
handleShowImages(index, photos, interval);
|
||||
|
||||
// setVisible(true)
|
||||
// console.log(imagesMaskRef.current);
|
||||
|
@ -121,14 +122,14 @@ export default function Photos({
|
|||
// index
|
||||
// );
|
||||
};
|
||||
const handleShowImages = (index, photos, btns,interval) => {
|
||||
const handleShowImages = (index, photos, interval) => {
|
||||
const mediaDom = document.createElement("div");
|
||||
mediaDom.style.width = "100vw";
|
||||
document.body.appendChild(mediaDom);
|
||||
mediaDom.className = `${
|
||||
photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
|
||||
}`;
|
||||
mediaDom.appendChild(btns);
|
||||
// mediaDom.appendChild(btns);
|
||||
ImageViewer.clear();
|
||||
ImageViewer.Multi.show({
|
||||
images: photos.map((item) => item?.url),
|
||||
|
|
Loading…
Reference in New Issue