@@ -21,6 +21,8 @@ npm install --save-dev svelte-range-slider-pips # if you prefer npm
2121
2222## usage
2323
24+ ### in a svelte project
25+
2426Assuming you have a Svelte app up and running;
2527
2628``` html
@@ -31,6 +33,37 @@ Assuming you have a Svelte app up and running;
3133<RangeSlider />
3234```
3335
36+ ### as a regular JS file
37+
38+ If you're using a different framework, or none, you can use the [ ` /dist/ `
39+ version of the script ` /dist/svelte-range-slider-pips.js ` ] ( dist/svelte-range-slider-pips.js ) and include it
40+ either with a regular ` <script> ` tag, or by using js imports (` import ` )
41+
42+ ``` html
43+ <script src =" ./js/vendor/svelte-range-slider-pips.js" />
44+
45+ < div id= " my-slider" >< / div>
46+
47+ < script>
48+ var mySlider = new RangeSliderPips ({
49+ target: document .getElementById (" my-slider" ),
50+ props: { /* props as js object */ }
51+ });
52+ </script >
53+ ```
54+
55+ ### as a JS module
56+ ``` js
57+ import RangeSlider from " ./node_modules/svelte-range-slider-pips/dist/svelte-range-slider-pips.mjs" ;
58+
59+ var mySlider = new RangeSlider ({
60+ target: node, // js reference to a DOM element
61+ props: { /* props as js object */ }
62+ });
63+ ```
64+
65+ ---
66+
3467## props (options)
3568### slider props
3669prop | type | default | description
@@ -59,11 +92,11 @@ prop | type | default | description
5992## contribue
6093
6194I am very happy to accept;
62- - suggestions/requests for new features or changes with examples of how they would be useful
63- - pull-requests for bug fixes, or issue resolution
64- - help with creating a proper test-suite
95+ - 🌟 suggestions/requests for new features or changes with examples of how they would be useful
96+ - 🛠 pull-requests for bug fixes, or issue resolution
97+ - 🧪 help with creating a proper test-suite
6598
66- When making changes/edits to the code you should use the ` /test/ ` folder and check the Readme .md in there
99+ ** When making changes/edits to the code you should use the ` /test/ ` folder** and check the [ README .md] ( test/README.md ) in there
67100to help with testing all the functionality. I don't have real tests set up, and would appreciate anyone's
68101help who knows how to accomplish that.
69102
0 commit comments