Skip to content

Commit 8d303a3

Browse files
javaLuojavaLuo
committed
0.5.6 - 调整安卓手机上原生滚动条的颜色和透明度
1 parent cd443f2 commit 8d303a3

File tree

4 files changed

+12
-17
lines changed

4 files changed

+12
-17
lines changed

‎README.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
99
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
1010
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
11-
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
11+
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
1212

1313
### 重构待测/未来计划
1414

@@ -237,4 +237,5 @@ export default {
237237
238238
### 更新
239239

240+
- 0.5.6 调整了安卓手机上原生滚动条的样式
240241
- 0.5.x 重构了,现在基于原生滚动条的默认行为

‎dist/ohyeah-scroll.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "vue-ohyeah-scroll",
33
"description": "prettier scroll",
4-
"version": "0.5.6-beta3",
4+
"version": "0.5.6",
55
"author": "L <https://blog.isluo.com>",
66
"license": "MIT",
77
"private": false,

‎src/packages/ohyeah/ohyeah.vue‎

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -224,7 +224,7 @@ export default {
224224
* 监听滚动条滚动事件
225225
* 原生滚动条为主，模拟滚动条跟随原生滚动条位置
226226
* 这里不做节流，需要灵敏
227-
* **/
227+
* */
228228
onScrollEvent() {
229229
const dom = this.$refs[`ohyeahbody-${this.id}`];
230230
if (this.realShowH) {
@@ -264,7 +264,7 @@ export default {
264264
* 重置轨道高度
265265
* 重置滑块高度
266266
* 重置真实滚动条位置
267-
* **/
267+
* */
268268
callback() {
269269
const dom = this.$refs[`ohyeahbody-${this.id}`];
270270
const b = dom.getBoundingClientRect(); // boxbody大小
@@ -314,7 +314,7 @@ export default {
314314
* @parame e 事件对象，为了得到当前鼠标在滑块上的位置
315315
* @params type 1垂直滚动条，2水平滚动条
316316
* @params targetNum 目标位置，用于在轨道上点击时瞬间记录最终位置，因为滚动可能为平滑滚动
317-
* **/
317+
* */
318318
onBarMousedown(e, type, targetNum) {
319319
e.preventDefault();
320320
// 是否来自点击轨道，点击轨道需要保持平滑
@@ -338,7 +338,7 @@ export default {
338338
* 轨道上鼠标按下
339339
* @param e 事件对象
340340
* @param type 1垂直滚动条/2水平滚动条
341-
* **/
341+
* */
342342
onTrackMousedown(e, type) {
343343
e.preventDefault();
344344
// this.needSmooth = false;
@@ -403,7 +403,7 @@ export default {
403403
/**
404404
* 横向或纵向滚动条被拖拽
405405
* @param e 拖动时的事件对象，为了实时获取鼠标位置
406-
* **/
406+
* */
407407
onBarDragMove(e) {
408408
const dom = this.$refs[`ohyeahbody-${this.id}`];
409409
@@ -477,7 +477,7 @@ export default {
477477
* @param x 水平真实滚动距离，null保持不变/'end'滚到底
478478
* @param y 垂直真实滚动距离，null保持不变/'end'滚到底
479479
* @param smooth 是否平滑滚动
480-
* **/
480+
* */
481481
scrollTo(x, y, smooth) {
482482
const dom = this.$refs[`ohyeahbody-${this.id}`];
483483
const s_y =
@@ -508,7 +508,7 @@ export default {
508508
},
509509
/**
510510
* 手动获取当前dom信息
511-
* **/
511+
* */
512512
getScrollInfo() {
513513
const dom = this.$refs[`ohyeahbody-${this.id}`];
514514
return {
@@ -554,16 +554,14 @@ export default {
554554
}
555555
}
556556
/* 移动端时生效 解决安卓默认不显示dom滚动条 */
557-
// 算了，自定义的滚动条不好看，还不如没有
558557
&.isAndroid {
559558
&::-webkit-scrollbar {
560559
width: 2px;
561560
height: 2px;
562-
padding: 1px;
563561
background-color: transparent;
564562
}
565563
&::-webkit-scrollbar-thumb {
566-
background-color: rgba(180, 180, 180, 0.4);
564+
background-color: rgba(200, 200, 200, 0.4);
567565
}
568566
}
569567
@@ -572,10 +570,6 @@ export default {
572570
}
573571
}
574572
575-
&.mobile {
576-
overflow: auto;
577-
-webkit-overflow-scrolling: touch;
578-
}
579573
&:hover {
580574
& > .ohyeah-scroll-vertical-track-h,
581575
& > .ohyeah-scroll-vertical-track-w {

0 commit comments

Comments
 (0)