{"id":1769,"date":"2010-11-15T10:24:58","date_gmt":"2010-11-15T10:24:58","guid":{"rendered":"http:\/\/mts-help.nick.php.dev\/after_sale_support\/jquery\/gallery\/article4.html"},"modified":"2020-01-28T05:12:29","modified_gmt":"2020-01-28T10:12:29","slug":"scroll-image-gallery","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/scroll-image-gallery.html","title":{"rendered":"Scroll Image Gallery"},"content":{"rendered":"This is a Gallery Script that uses <a class=\"link3\" href=\"http:\/\/jqueryui.com\/\">jQueryui ui<\/a>. <p> <strong>JavaScript<\/strong> <br \/>In order to make the script work, the <strong>index-#.html<\/strong> file with the gallery should contain these lines of HTML code:<\/p> <p>The <strong>gallery.js<\/strong> file contains these lines of code that make the gallery work:<\/p> <p>This script does not require any configuration.<\/p> <p> <strong>HTML<\/strong> <br \/>Bulleted list is used to display the slides. The <strong>&lt;div&gt;<\/strong> tag with the <strong>.slider<\/strong> class and a nested <strong>&lt;div&gt;<\/strong> tag with the <strong>.handle<\/strong> class are used to display the scrollbar. So in order to customize the scrollbar you will need to edit the styles within the corresponding classes (<strong>.slider<\/strong> and <strong>.handle<\/strong>).<\/p> <p> <strong>CSS<\/strong> <br \/>You can find script related stylesheet in the main <strong>style.css<\/strong> file.<\/p> <p>Make sure to put a correct width value for the <strong>.slider<\/strong> class. This value is counted as total width of all slides together with the spaces between&nbsp;adjacent slides.<\/p>","protected":false},"excerpt":{"rendered":"<p>This is a Gallery Script that uses jQueryui ui. JavaScript In order to make the script work, the index-#.html file with the gallery should contain these lines of HTML code: The gallery.js file contains these lines of code that make the gallery work: This script does not require any configuration. HTML Bulleted list is used [&hellip;]<\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[267],"tags":[499,813],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1769"}],"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=1769"}],"version-history":[{"count":4,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1769\/revisions"}],"predecessor-version":[{"id":85750,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/1769\/revisions\/85750"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=1769"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=1769"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=1769"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}