Update scroll.md

docs/assets/tutorials/en/interaction/scroll.md

@@ -21,17 +21,84 @@ VTable provides rich scroll style configuration items, and users can customize t
 Below we show the effect of these configurations with an example:
 
 ```javascript livedemo  template=vtable
-const table =new VTable.ListTable(
-    ...
-    theme: {
-    scrollStyle: {
-        visible:'always',
-        scrollSliderColor:'purple',
-        scrollRailColor:'#bac3cc',
-        hoverOn:false
+let  tableInstance;
+fetch('https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/North_American_Superstore_data.json')
+    .then((res) => res.json())
+    .then((data) => {
+  const columns =[
+      {
+          "field": "Order ID",
+          "title": "Order ID",
+          "width": "auto"
+      },
+      {
+          "field": "Customer ID",
+          "title": "Customer ID",
+          "width": "auto"
+      },
+      {
+          "field": "Product Name",
+          "title": "Product Name",
+          "width": "auto"
+      },
+      {
+          "field": "Category",
+          "title": "Category",
+          "width": "auto"
+      },
+      {
+          "field": "Sub-Category",
+          "title": "Sub-Category",
+          "width": "auto"
+      },
+      {
+          "field": "Region",
+          "title": "Region",
+          "width": "auto"
+      },
+      {
+          "field": "City",
+          "title": "City",
+          "width": "auto"
+      },
+      {
+          "field": "Order Date",
+          "title": "Order Date",
+          "width": "auto"
+      },
+      {
+          "field": "Quantity",
+          "title": "Quantity",
+          "width": "auto"
+      },
+      {
+          "field": "Sales",
+          "title": "Sales",
+          "width": "auto"
+      },
+      {
+          "field": "Profit",
+          "title": "Profit",
+          "width": "auto"
       }
-    }
-}
+  ];
+
+  const option = {
+    records:data,
+    columns,
+    widthMode:'standard',
+        theme: {
+      scrollStyle: {
+          visible:'always',
+          scrollSliderColor:'purple',
+          scrollRailColor:'#bac3cc',
+          hoverOn:false
+        }
+      }
+  };
+  tableInstance =  new VTable.ListTable(document.getElementById(CONTAINER_ID), option);
+  window['tableInstance'] = tableInstance;
+})
 ```
 
 ## Scroll horizontally