DESKTOP-GBA0BK8\Admin
41 lines
894 B
JavaScript
41 lines
894 B
JavaScript
import React, { useState, useEffect } from "react";
|
|
|
|
const ScrollToTop = () => {
|
|
const [showScroll, setShowScroll] = useState(false);
|
|
|
|
useEffect(() => {
|
|
window.addEventListener("scroll", checkScrollTop);
|
|
return function cleanup() {
|
|
window.removeEventListener("scroll", checkScrollTop);
|
|
};
|
|
});
|
|
|
|
const checkScrollTop = () => {
|
|
if (!showScroll && window.pageYOffset > 100) {
|
|
setShowScroll(true);
|
|
} else if (showScroll && window.pageYOffset <= 100) {
|
|
setShowScroll(false);
|
|
}
|
|
};
|
|
|
|
const scrollTop = () => {
|
|
window.scrollTo({ top: 0, behavior: "smooth" });
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div
|
|
className="scroll-to-top"
|
|
onClick={scrollTop}
|
|
style={{
|
|
display: showScroll ? "block" : "none",
|
|
}}
|
|
>
|
|
<i className="ri-arrow-up-line"></i>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ScrollToTop;
|