{"id":1924,"date":"2013-06-12T17:00:35","date_gmt":"2013-06-12T13:00:35","guid":{"rendered":"http:\/\/www.dhtmlx.com\/blog\/?p=1924"},"modified":"2023-05-05T14:08:06","modified_gmt":"2023-05-05T11:08:06","slug":"custom-scroll-for-dhtmlx-components","status":"publish","type":"post","link":"https:\/\/dhtmlx.com\/blog\/custom-scroll-for-dhtmlx-components\/","title":{"rendered":"Custom Scroll for DHTMLX Components"},"content":{"rendered":"

With the latest version of DHTMLX, you can add custom scrolls to the DHTMLX components, such as Grid, Tree, Layout, DataView, and others. The custom scroll looks and behaves similar to scrolls on Mac OS. The scroll bar is hidden and appears when the user start scrolling. It also gets wider on mouse over. <\/p>\n

\"dhtmlxGrid<\/p>\n

To enable custom scroll feature, you need to download the required files<\/a> (customscroll.js<\/em> and customscroll.css<\/em>) and add them to the page after the dhtmlx library:<\/p>\n

<link<\/span> rel<\/span>=<\/span>"stylesheet"<\/span> type<\/span>=<\/span>"text\/css"<\/span> href<\/span>=<\/span>"customscroll.css"<\/span>><\/span>
\n<script<\/span> type<\/span>=<\/span>"text\/javascript"<\/span> src<\/span>=<\/span>"customscroll.js"<\/span>><\/<\/span>script<\/span>><\/span>
\n<script<\/span> type<\/span>=<\/span>"text\/javascript"<\/span>><\/span>
\n \u00a0 \u00a0 \u00a0 dhtmlx.CustomScroll.init();
\n<\/<\/span>script<\/span>><\/span><\/div><\/div>\n

With the latest version of DHTMLX, you can add custom scrolls to the DHTMLX components, such as Grid, Tree, Layout, DataView, and others. The custom scroll looks and behaves …<\/p>\n","protected":false},"author":2,"featured_media":3347,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71,1],"tags":[33,18,14],"class_list":["post-1924","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","category-uncategorized","tag-all-posts","tag-labs","tag-tips"],"_links":{"self":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/1924","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/comments?post=1924"}],"version-history":[{"count":1,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/1924\/revisions"}],"predecessor-version":[{"id":10821,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/1924\/revisions\/10821"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/media\/3347"}],"wp:attachment":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/media?parent=1924"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/categories?post=1924"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/tags?post=1924"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

After that, all DHTMLX components on the page will use custom scrolls. You can download the demo<\/a> to see how it can be used with dhtmlxGrid. <\/p>\n","protected":false},"excerpt":{"rendered":"