扫码关注官方订阅号
如题,我有一个取消按钮。hover 的时候有效果,点击以后才取消。 在手机下,如果我想取消得点击两次,有什么方法禁止掉这个按钮的 hover 吗?
小伙看你根骨奇佳,潜力无限,来学PHP伐。
取消按鈕是啥。。。
移動端沒有真正意義上的鼠標,而是在點擊的同時觸發鼠標移動事件。
我來講一下機制,移動端是沒有鼠標的,自然也就沒有 hover。但是爲了兼容又虛擬出了鼠標,這個鼠標僅在點擊的時候纔會移動,這時候 touch 事件觸發的同時也會觸發 hover。想要禁止 hover 只要禁止掉 touch 事件就行了。
還是沒搞懂你的設計思路,正常情況下不是要把 hover 樣式直接覆蓋掉的嗎,要不然在桌面端點擊一次後還要移開鼠標才行。。。
@meida screen and (hover:0){ /* 把hover的样式跟一般情况下做成一样*/ }
同时监听mouseenter和touchstart事件,在移动端,touchstart的监听器会覆盖mouseenter的监听器。http://jsbin.com/bomavi/1/edit?js,output
mouseenter
touchstart
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
取消按鈕是啥。。。
移動端沒有真正意義上的鼠標,而是在點擊的同時觸發鼠標移動事件。
我來講一下機制,移動端是沒有鼠標的,自然也就沒有 hover。但是爲了兼容又虛擬出了鼠標,這個鼠標僅在點擊的時候纔會移動,這時候 touch 事件觸發的同時也會觸發 hover。想要禁止 hover 只要禁止掉 touch 事件就行了。
還是沒搞懂你的設計思路,正常情況下不是要把 hover 樣式直接覆蓋掉的嗎,要不然在桌面端點擊一次後還要移開鼠標才行。。。
同时监听
mouseenter
和touchstart
事件,在移动端,touchstart
的监听器会覆盖mouseenter
的监听器。http://jsbin.com/bomavi/1/edit?js,output