SHARE
TWEET

Untitled

a guest Jul 18th, 2019 68 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div id="example" style="margin:auto; width:60%">
  2.     <div id="scrollView" style="height: 600px; width:100%;"></div>
  3. </div>
  4.  
  5. <script id="scrollview-template" type="text/x-kendo-template">
  6.     # for (var i = 0; i < data.length; i++) { #
  7.     <div  data-role="page" style="width:100%;">
  8.         <img class="carousal-image" src="#=
  9.         getPreviewImageUrl(data[i].Type,data[i].PreviewImageUrl) #"/>
  10.     </div>
  11.     # } #
  12. </script>
  13.  
  14. <script>
  15.        var dataSource = new kendo.data.DataSource({
  16.             transport: {
  17.                 read: {
  18.                     url: "sample api",
  19.                     dataType: "json"
  20.                 }
  21.             },
  22.             pageSize:1,
  23.             schema: {
  24.                 data: "items"
  25.             },
  26.  
  27.         });
  28.  
  29.         $("#scrollView").kendoScrollView({
  30.             dataSource: dataSource,
  31.             template: $("#scrollview-template").html(),
  32.             contentHeight: "100%"
  33.  
  34.         });
  35. </script>
  36. Sample josn data
  37.  
  38. {
  39.     "items": [
  40.         {
  41.  
  42.             "PreviewImageUrl": "/images/ui/Default_News.png",
  43.             "Type": "NewsType"
  44.         },
  45.         {
  46.             "PreviewImageUrl": "/images/ui/Default_Blog.png",
  47.             "Type": "BlogType"
  48.         }
  49.     ],
  50.     "total": 2
  51. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top