我想在用户使用触摸屏时隐藏div。它是一个react js功能组件。
我要隐藏的div是这样的:
<div className="scrollButtons">
<button
className={count <= 0 ? 'buttonLeftOpacity' : 'buttonLeft'}
type="button"
onMouseDown={() => clickHandlerLeft()}
>
{'<'}
</button>
<button className="buttonRight" type="button" onMouseDown={() => clickHandlerRight()}>
{'>'}
</button>
</div>
</>
我用来检测用户是否在触摸屏上的代码如下:
window.addEventListener('touchstart', function userTouch() {
console.log(userTouch());
});
当用户使用触摸屏时，如何使用该代码隐藏div？提前谢谢你！
创建一个不显示的类
.example {
display:none;
}
然后添加这个
window.addEventListener('touchstart', function userTouch() {
var element = document.getElementById("scrollbuttons"); // selecting the element you want to edit, make sure to add the ID to the button if you are using this method.
element.classList.add("example"); //add invisible className
});
