From 5069718c4f1fa4be395156da219a3d508ef5365d Mon Sep 17 00:00:00 2001
From: wayne <chengzhou.weng@fraudmetrix.cn>
Date: Mon, 9 Oct 2017 10:42:42 +0800
Subject: [PATCH] Carbon: fix scrollbar style in safari & ff

---
 examples/app.vue                      | 16 ++++++++--------
 examples/components/header.vue        |  2 +-
 examples/pages/template/component.tpl |  4 ++++
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/examples/app.vue b/examples/app.vue
index e51ace726..f229c0c93 100644
--- a/examples/app.vue
+++ b/examples/app.vue
@@ -7,7 +7,13 @@
     margin: 0;
     padding: 0;
     height: 100%;
-    overflow-y: hidden;
+    font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
+    font-weight: 400;
+    -webkit-font-smoothing: antialiased;
+
+    &.is-component {
+      overflow: hidden;
+    }
   }
 
   #app {
@@ -22,6 +28,7 @@
         height: 100%;
         min-height: auto;
       }
+
       .headerWrapper {
         position: fixed;
         width: 100%;
@@ -36,13 +43,6 @@
     }
   }
 
-  body {
-    font-family: 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',SimSun,sans-serif;
-    overflow: auto;
-    font-weight: 400;
-    -webkit-font-smoothing: antialiased;
-  }
-
   a {
     color: #409EFF;
     text-decoration: none;
diff --git a/examples/components/header.vue b/examples/components/header.vue
index 911539096..f116920e1 100644
--- a/examples/components/header.vue
+++ b/examples/components/header.vue
@@ -476,7 +476,7 @@
 
     mounted() {
       function scroll(fn) {
-        document.body.addEventListener('scroll', fn, false);
+        window.addEventListener('scroll', fn, false);
       }
       scroll(() => {
         if (this.isHome) {
diff --git a/examples/pages/template/component.tpl b/examples/pages/template/component.tpl
index aad9c79c2..2a98fddd2 100644
--- a/examples/pages/template/component.tpl
+++ b/examples/pages/template/component.tpl
@@ -241,6 +241,10 @@
       this.componentScrollBox = this.componentScrollBar.$el.querySelector('.el-scrollbar__wrap');
       this.throttledScrollHandler = throttle(300, this.handleScroll);
       this.componentScrollBox.addEventListener('scroll', this.throttledScrollHandler);
+      document.body.classList.add('is-component');
+    },
+    destroyed() {
+      document.body.classList.remove('is-component');
     },
     beforeDestroy() {
       this.componentScrollBox.removeEventListener('scroll', this.throttledScrollHandler);