The ScrollHorizontalPane.js<\/span> file contains these lines of code that initialize the script functionality with basic values: Here the script attributes define the following values:<\/p> \u2022 scrollbarHeight<\/span> – the height of the generated scrollbar in pixels; HTML<\/span> CSS<\/span> This is a Scroll Script that allows adding add a custom horizontal scroll for extra content inside the block. JavaScript In order to make the script work, the index-#.html file with a gallery should contain these lines of HTML code: The ScrollHorizontalPane.js file contains these lines of code that initialize the script functionality with basic […]<\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[263],"tags":[813],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1755"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=1755"}],"version-history":[{"count":8,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1755\/revisions"}],"predecessor-version":[{"id":85746,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1755\/revisions\/85746"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=1755"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=1755"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=1755"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
<\/p>
\u2022 scrollbarMargin<\/span> – the amount of space to leave on the side of the scrollbar in pixels;
\u2022 wheelSpeed<\/span> – the speed the pane will scroll in response to the mouse wheel in pixels;
\u2022 showArrows<\/span> – whether to display arrows for the user to scroll with;
\u2022 arrowSize<\/span> – the height of the arrow buttons if showArrows<\/span> is set to true<\/span>;
\u2022 animateTo<\/span> – whether to animate when calling scrollTo<\/span> and scrollBy<\/span>;
\u2022 dragMinWidth<\/span> – the minimum width to allow the drag bar to be;
\u2022 dragMaxWidth<\/span> – the maximum width to allow the drag bar to be;
\u2022 animateInterval<\/span> – the interval in milliseconds to update an animating pane (default 100<\/span>);
\u2022 animateStep<\/span> – the amount to divide remaining scroll distance by when animating (default 3<\/span>);
\u2022 maintainPosition<\/span> – whether you want the contents of the scroll pane to maintain it\u2019s position when you re-initialize it – so it doesn\u2019t scroll as you add more content (default true<\/span>);
\u2022 resize<\/span> – whether or not to have resizing turned on or not;
\u2022 minimumWidth<\/span> – the minimum width to allow the jScrollHorizontalPane to be resized to; only effective when resize is on;
\u2022 reset<\/span> – when set to true<\/span> all the global properties will be reset. This is useful for dynamic refreshes on the page.
<\/p>
Below you can see general HTML script representation:
<\/p>
You can find script related stylesheet in the main style.css<\/span> file.
<\/p>","protected":false},"excerpt":{"rendered":"