diff --git a/src/components/date-picker/base/time-spinner.vue b/src/components/date-picker/base/time-spinner.vue
index 79d866f5..db401335 100644
--- a/src/components/date-picker/base/time-spinner.vue
+++ b/src/components/date-picker/base/time-spinner.vue
@@ -175,12 +175,10 @@
             },
             updateScroll () {
                 const times = ['hours', 'minutes', 'seconds'];
-                times.forEach(type => this.$els[type].style.overflow = 'hidden');
                 this.$nextTick(() => {
                     times.forEach(type => {
                         this.$els[type].scrollTop = 24 * this.getScrollIndex(type, this[type]);
                     });
-                    this.$nextTick(() => times.forEach(type => this.$els[type].style.overflow = 'auto'));
                 });
             },
             formatTime (text) {
diff --git a/src/styles/components/time-picker.less b/src/styles/components/time-picker.less
index a8d3b553..6d47494a 100644
--- a/src/styles/components/time-picker.less
+++ b/src/styles/components/time-picker.less
@@ -15,11 +15,15 @@
 
         &-list{
             width: @time-picker-cells-width-base;
-            float: left;
-            position: relative;
             max-height: 144px;
-            overflow-y: auto;
+            float: left;
+            overflow: hidden;
             border-left: 1px solid @border-color-split;
+            position: relative;
+            &:hover{
+                overflow-y: auto;
+            }
+
             &:first-child{
                 border-left: none;
                 border-radius: @btn-border-radius 0 0 @btn-border-radius;
@@ -38,7 +42,7 @@
                     line-height: 24px;
                     margin: 0;
                     padding: 0 0 0 16px;
-                    box-sizing: border-box;
+                    box-sizing: content-box;
                     text-align: left;
                     user-select: none;
                     cursor: pointer;
diff --git a/test/routers/date.vue b/test/routers/date.vue
index 331b350e..602cab0a 100644
--- a/test/routers/date.vue
+++ b/test/routers/date.vue
@@ -1,10 +1,10 @@
 <template>
     <row>
         <i-col span="12">
-            <Date-picker type="datetime" :options="options1" placeholder="选择日期" style="width: 200px"></Date-picker>
+            <Time-picker :value="val" type="time" placeholder="选择时间" style="width: 168px"></Time-picker>
         </i-col>
         <i-col span="12">
-            <Date-picker type="datetimerange" :options="options2" placement="bottom-end" placeholder="选择日期" style="width: 200px"></Date-picker>
+            <Time-picker type="timerange" placement="bottom-end" placeholder="选择时间" style="width: 168px"></Time-picker>
         </i-col>
     </row>
 </template>
@@ -12,72 +12,7 @@
     export default {
         data () {
             return {
-                options1: {
-                    shortcuts: [
-                        {
-                            text: '今天',
-                            value () {
-                                return new Date();
-                            },
-                            onClick: (picker) => {
-                                this.$Message.info('点击了今天');
-                            }
-                        },
-                        {
-                            text: '昨天',
-                            value () {
-                                const date = new Date();
-                                date.setTime(date.getTime() - 3600 * 1000 * 24);
-                                return date;
-                            },
-                            onClick: (picker) => {
-                                this.$Message.info('点击了昨天');
-                            }
-                        },
-                        {
-                            text: '一周前',
-                            value () {
-                                const date = new Date();
-                                date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
-                                return date;
-                            },
-                            onClick: (picker) => {
-                                this.$Message.info('点击了一周前');
-                            }
-                        }
-                    ]
-                },
-                options2: {
-                    shortcuts: [
-                        {
-                            text: '最近一周',
-                            value () {
-                                const end = new Date();
-                                const start = new Date();
-                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-                                return [start, end];
-                            }
-                        },
-                        {
-                            text: '最近一个月',
-                            value () {
-                                const end = new Date();
-                                const start = new Date();
-                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-                                return [start, end];
-                            }
-                        },
-                        {
-                            text: '最近三个月',
-                            value () {
-                                const end = new Date();
-                                const start = new Date();
-                                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-                                return [start, end];
-                            }
-                        }
-                    ]
-                }
+                val: new Date
             }
         }
     }