我有一個像這樣的水平滾動 flexbox。
每個框寬度為 25%。我正在嘗試使用按鈕左右滾動。現在它像代碼一樣滾動 420px,但這會導致回應問題。有沒有辦法在反應中使用“25%”而不是“420”。
const scrollLeftHandler = () => {
var elmnt = document.getElementById("programCard");
if (elmnt.scrollLeft !== 0) {
elmnt.scrollLeft = -420;
setIsRightSlide(true);
} else {
setIsLeftSlide(false);
}
};
const scrollRightHandler = () => {
var elmnt = document.getElementById("programCard");
if (elmnt.scrollLeft % 420 === 0 && isRightSlide) {
console.log("if");
setIsLeftSlide(true);
elmnt.scrollLeft = 420;
} else if (isRightSlide) {
elmnt.scrollLeft = elmnt.scrollLeft - (elmnt.scrollLeft % 420);
elmnt.scrollLeft = 420;
setIsRightSlide(false);
} else {
console.log("else", elmnt.scrollLeft);
setIsRightSlide(false);
}
https://i.stack.imgur.com/gDpss.png
uj5u.com熱心網友回復:
您可以使用:
let step = (window.innerWidth || docElem.clientWidth || body.clientWidth)*(25/100)
您可以替換420為step.
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/357343.html
標籤:javascript html 反应 反应原生 滚动
