移動端滑動事件

2021-08-21 14:21:00 字數 368 閱讀 9392

專案中要實現乙個功能,在寬度高度固定的乙個div中放入幾張,的高度與div的高度相等,幾張的總長度要遠遠超過div的長度,那麼問題來了,如何才能讓使用者通過手指的滑動,看到所有的呢?

這個可以有兩種方法:

方法一:

此時,已經可以進行的滑動了

方法二:

在父元素上設定white-space: nowrap,保證子元素不會換行,共兩層(所有瀏覽器都支援 white-space 屬性)

此時,已經可以進行的滑動了。

這兩個方法都簡單但很實用!我之前用的touch事件來達到同樣的效果,就比較繁瑣了。

移動端的手勢事件 左右滑動

會聽過什麼左滑喜歡,右滑不喜歡,那麼這樣的滑動手勢如何實現,在此用touch事件來實現左右滑動的判斷 lang en charset utf 8 name viewport content width device width,user scalable no,initial scale 1.0,m...

移動端觸屏滑動touch事件相關

移動端觸屏滑動的效果其實就是輪播,在pc的頁面上很好實現,繫結click和mouseover等事件來完成。但是在移動裝置上,要實現這種輪播的效果,就需要用到核心的touch事件。處理touch事件能跟蹤到螢幕滑動的每根手指。以下是四種touch事件 touchstart 手指放到螢幕上時觸發 tou...

移動端事件

移動端事件 onclick 移動端也可以使用onclick事件,但是查閱資料上說會有300ms的延遲,究竟是不是有待考究。ontouchstart 相當於pc端的onmousedown,詳細可參照先前寫的文件 事件 下同 ontouchend 相當於pc端的onmouseup.ontouchmove...