国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 開發 > CSS > 正文

css移動端實現與pc端一樣的:acitve效果

2024-07-11 08:30:28
字體:
來源:轉載
供稿:網友
做移動前端也有一些日子了,一直有個問題沒有解決,就是與pc端那樣的一個:hover的效果,:hover是鼠標指針浮動在其上的元素的一個選擇器,但因為在移動端是沒有鼠標的,代替的是觸摸屏,用戶也不是有“鼠標指針浮動在其上的元素”的情況,有也很少。 所以取代的應該:active這個選擇器,但是通過實踐,發現情況不是很理想,在QQ瀏覽器上有時觸發,有沒不觸發,在我mx3帶自瀏覽器上根本沒效果。

最近在看美團h5的頁面時發現他們做對這個效果做得很好(這里說實話,美團網在h5這一塊做得真好),看了他們代碼之后,發現他們也是用:active來實現這個效果,但他們多了一行js代碼,


復制代碼
代碼如下:
document.body.addEventListener('touchstart', function () { });

其實這行代碼帶沒有做什么事,只是對body綁定了一個touchstart事件,然后也沒做什么事。

自已實踐了一下發現可以了,效果真心不錯。贊一下美團。

ps:在移動端中瀏覽器會有自帶的一個點擊高亮效果,可以通過給a標簽或者body,html加 

復制代碼
代碼如下:
-webkit-tap-highlight-color:transparent;


都行。
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 闵行区| 额敏县| 玉溪市| 富裕县| 霍州市| 喀喇| 得荣县| 宁陕县| 麻江县| 兴隆县| 武乡县| 缙云县| 松溪县| 南雄市| 渝中区| 开远市| 怀集县| 盐边县| 九江县| 神池县| 株洲县| 土默特右旗| 灵宝市| 林西县| 剑川县| 新和县| 阿拉善左旗| 资溪县| 驻马店市| 桑植县| 沭阳县| 梁山县| 通海县| 松江区| 屏东市| 梅州市| 梧州市| 隆德县| 台中市| 弋阳县| 高青县|