自定義滾動軸

2021-10-18 07:39:16 字數 1144 閱讀 1265

-webkit-這個是谷歌瀏覽器的字首,自定義滾動軸只有谷歌瀏覽器支援。

:

:-webkit-scrollbar

:/*滾動軸整體*/::

-webkit-scrollbar-thumb

:/*滑塊*/::

-webkit-scrollbar-track

:/*滑動軌道*/::

-webkit-scrollbar-button

:/*兩端按鈕*/::

-webkit-scrollbar-track-piece

:/*內層軌道*/::

-webkit-scrollbar-corner

:/*滾動軸交匯處*/::

-webkit-resizer

:/*改變滾動條大小*/

下面給出乙個例項

class

='merchandise-item'

wx:for

="}"

wx:key

="index"

>

class

='kuaidiicon'

src="}"

>

image

>

>

}快遞text

>

class

="price"

>

¥} 元text

>

class

='add-merchandise'

src="}"

>

image

>

view

>

/*wxss*/

.merchandise

.merchandise::-webkit-scrollbar

.merchandise::-webkit-scrollbar-thumb

效果如下

**內容很簡單,相信聰明的各位都能看明白!

ps:只給出了關鍵部分的**,並不是全部。

自定義封裝時間軸縱向滾動

時間軸滾動以前沒寫過,今天寫著玩,只實現了滑鼠縱向滑動時間軸的效果,暫時沒做三列聯動效果 效果圖如下 具體實現的 如下 container column scroll scroll li select function this.config.container document.getelemen...

時間軸(自定義)

先上效果圖 專案中要求做成上面的效果,在swiper官網找了一下找到類似的,但是起始位置在中間,沒辦法,只能自己動手借用swiper的css 剛開始用swiper寫的,有些樣式懶得改。做出自己想要的效果 細節方面沒做好不要介意,手動捂臉!html css swiper container width...

自定義滾動導航控制項

2015 04 25 更新控制左邊距,水平間距,固定title寬屬性,增加非相鄰頻道切換不需要動畫方式。之前囤了不少自定義的控制項,都準備放上來的,但是太懶了.最近發現有需要的時候卻死活找不著了,所以決定開始整理整理,挨個放上來,既幫助了有需要的人也方便了自己.滾動導航檢視 效果圖 覺得不錯請點一下...