1- tail.select.js - Beautify Select Fields
2- ====================================
1+ # tail.select.js - Beautify Select Fields
32
43![ npm] ( https://img.shields.io/npm/v/tail.select.js?style=flat-square )
54![ npm] ( https://img.shields.io/npm/dw/tail.select.js?style=flat-square )
@@ -13,20 +12,20 @@ The **tail.select** script is back, rewritten in vanilla JavaScript and ready to
1312
1413** NOTE #2 ** : Version ` 0.5.23 ` is the last one in the ` 0.5.x ` branch. The next version is ` 1.x ` and contains breaking changes. If you have an older implementation, and you use custom code, please stick to the ` 0.5.x ` branch. This branch is no longer maintained, but it's stable.
1514
16- ----------------------------
15+ ---
1716
1817[ Want to see ** tail.select** in action?] ( https://getbutterfly.com/tail-select/ )
1918
20- Support
21- -------
19+ ## Support
20+
2221<p style =" text-align : center " >
2322 You really like my <b>tail.select</b> script and want to support me and all of my projects?<br>
2423 Then I would be extremely grateful for a coffee! (<b>Thanks to all Supporters</b>)<br><br>
2524 <a href="https://www.buymeacoffee.com/wolffe"><img src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Buy Me A Coffee"></a>
2625</p >
2726
28- Features
29- --------
27+ ## Features
28+
3029- ** Beautiful** . 2 different designs (light and dark)
3130- ** Extensive** .
3231 - Search bar to find options quickly...
@@ -35,8 +34,8 @@ Features
3534- ** Zero dependencies** . And written in vanilla JavaScript...
3635- ** Free to use** . Because it's MIT licensed <3
3736
38- Install & Embed
39- ---------------
37+ ## Install & Embed
38+
4039The master branch will always contain the latest release, which you can download directly here
4140as [ .tar] ( https://github.com/wolffe/tail.select.js/tarball/master ) or as [ .zip] ( https://github.com/wolffe/tail.select.js/zipball/master )
4241archive, or just visit the [ Releases] ( https://github.com/wolffe/tail.select.js/releases ) Page
@@ -55,145 +54,17 @@ bower install tail.select.js --save
5554```
5655
5756### Using a CDN
57+
5858You can also use the awesome CDN services from jsDelivr or UNPKG.
5959
6060``` markup
6161https://www.npmjs.com/package/tail.select.js
6262```
6363
6464``` markup
65- https://cdn.jsdelivr.net/npm/tail.select.js@1.0 .0/js/tail.select.min.js
65+ https://cdn.jsdelivr.net/npm/tail.select.js@1.1 .0/js/tail.select.min.js
6666```
6767
6868``` markup
69- https://unpkg.com/browse/tail.select.js@1.0.0/
70- ```
71-
72- ### Thanks To (` 0.5.x ` Branch)
73- - SamBrishes, pytesNET (Copyright © ; 2014-2019)
74- - [ Octicons] ( https://octicons.github.com/ ) for the cute Icons
75-
76- ### Translations (` 0.5.x ` Branch)
77- - [ Anthony Rabine] ( https://github.com/arabine ) / [ French Translation] ( https://github.com/wolffe/tail.select.js/issues/11 )
78- - [ Igor] ( https://github.com/igorcm ) / [ Brazilian Portuguese Translation] ( https://github.com/wolffe/tail.select.js/pull/34 )
79- - [ Noxludio] ( https://github.com/noxludio ) / [ Finnish Translation] ( https://github.com/wolffe/tail.select.js/pull/35 )
80- - [ Roman Yepanchenko] ( https://github.com/tizis ) / [ Russian Translation] ( https://github.com/wolffe/tail.select.js/issues/38 )
81- - [ elPesecillo] ( https://github.com/elPesecillo ) / [ Spanish Translation] ( https://github.com/wolffe/tail.select.js/issues/41 )
82- - [ Alberto Vincenzi] ( https://github.com/albertovincenzi ) / [ Italian Translation] ( https://github.com/wolffe/tail.select.js/issues/43 )
83- - [ WoxVold] ( https://github.com/woxwold ) / [ Norwegish Translation] ( https://github.com/wolffe/tail.select.js/issues/45 )
84- - [ Spritus] ( https://github.com/spritus ) / [ Turkish Translation] ( https://github.com/wolffe/tail.select.js/issues/48 )
85- - [ 5ergiu] ( https://github.com/5ergiu ) / [ Romanian Translation] ( https://github.com/wolffe/tail.select.js/issues/10 )
86- - [ achatzi78] ( https://github.com/achatzi78 ) / [ Greek Translation] ( https://github.com/wolffe/tail.select.js/issues/8 )
87-
88- Documentation (` 0.5.x ` Branch)
89- -------------
90- The documentation has been moved to [ GitHubs Wiki Pages] ( https://github.com/wolffe/tail.select.js/wiki ) ,
91- but I will keep a table of contents list here and some basic instructions.
92-
93- - [ Install & Embed] ( https://www.github.com/wolffe/tail.select.js/wiki/instructions )
94- - [ Default Usage] ( https://www.github.com/wolffe/tail.select.js/wiki/default-usage )
95- - [ Public Options] ( https://www.github.com/wolffe/tail.select.js/wiki/public-options )
96- - [ Public Methods] ( https://www.github.com/wolffe/tail.select.js/wiki/public-methods )
97- - [ Events & Callbacks] ( https://www.github.com/wolffe/tail.select.js/wiki/events-callbacks )
98- - [ Internal Variables & Methods] ( https://www.github.com/wolffe/tail.select.js/wiki/internal )
99- - [ HowTos, Tips & Tricks] ( https://www.github.com/wolffe/tail.select.js/wiki/How-Tos )
100-
101- ### Files (` 0.5.x ` Branch)
102- The ` tail.select ` package contains different JavaScript files:
103-
104- - ` js/tail.select(.min).js ` The main JavaScript with ` en ` tranlation strings only.
105- - ` js/tail.select-full(.min).js ` The main JavaScript with ALL available translations.
106- - ` langs/tail.select-all(.min).js ` Just ALL translation strings itself.
107- - ` langs/tail.select-{locale}.js ` Just the {locale} translation strings.
108-
109- ### Basic Instructions (` 0.5.x ` Branch)
110- You can pass up to 2 arguments to the ** tail.select** constructor, the first parameter is required
111- and need to be an ` Element ` , a ` NodeList ` , a ` HTMLCollection ` , an Array with ` Element ` objects or
112- just a single selector as ` string ` , which calls the ` querySelectorAll() ` method on its own. The
113- second parameter is optional and, if set, MUST be an object with your * tail.select* options.
114-
115- ``` html
116- <!doctype html>
117- <html >
118- <head >
119- <meta charset =" utf-8" >
120- <meta name =" viewport" content =" width=device-width, initial-scale=1" >
121- <link type =" text/css" rel =" stylesheet" href =" css/tail.select-default.css" >
122- </head >
123- <body >
124- <script src =" js/tail.select.min.js" ></script >
125- <!-- <script src="langs/tail.select-{lang}.js"></script> -->
126-
127- <select >
128- <option >My First Option</option >
129- <option >My Second Option</option >
130- <option >My Third Option</option >
131- </select >
132-
133- <script >
134- document .addEventListener (' DOMContentLoaded' , () => {
135- tail .select (' select' , {
136- // Your options here
137- });
138- });
139- </script >
140- </body >
141- </html >
142- ```
143-
144- ### Default options (` 0.5.x ` Branch)
145- Please check out [ GitHubs Wiki Pages] ( https://github.com/wolffe/tail.select.js/wiki ) to read more
146- about each single option!
147-
148- ``` javascript
149- tail .select (" select" , {
150- animate: true , // [0.3.0] Boolean
151- classNames: null , // [0.2.0] Boolean, String, Array, null
152- csvOutput: false , // [0.3.4] Boolean
153- csvSeparator: " ," , // [0.3.4] String
154- descriptions: false , // [0.3.0] Boolean
155- deselect: false , // [0.3.0] Boolean
156- disabled: false , // [0.5.0] Boolean
157- height: 350 , // [0.2.0] Integer, null
158- hideDisabled: false , // [0.3.0] Boolean
159- hideSelected: false , // [0.3.0] Boolean
160- items: {}, // [0.3.0] Object
161- locale: " en" , // [0.5.0] String
162- linguisticRules: { // [0.5.9] Object
163- " е" : " ё" ,
164- " a" : " ä" ,
165- " o" : " ö" ,
166- " u" : " ü" ,
167- " ss" : " ß"
168- },
169- multiple: false , // [0.2.0] Boolean
170- multiLimit: Infinity , // [0.3.0] Integer, Infinity
171- multiPinSelected: false , // [0.5.0] Boolean
172- multiContainer: false , // [0.3.0] Boolean, String
173- multiShowCount: true , // [0.3.0] Boolean
174- multiShowLimit: false , // [0.5.0] Boolean
175- multiSelectAll: false , // [0.4.0] Boolean
176- multiSelectGroup: true , // [0.4.0] Boolean
177- openAbove: null , // [0.3.0] Boolean, null
178- placeholder: null , // [0.2.0] String, null
179- search: false , // [0.3.0] Boolean
180- searchConfig: [ // [0.5.13] Array
181- " text" , " value"
182- ],
183- searchFocus: true , // [0.3.0] Boolean
184- searchMarked: true , // [0.3.0] Boolean
185- searchMinLength: 1 , // [0.5.13] Integer
186- searchDisabled: true , // [0.5.5] Boolean
187- sortItems: false , // [0.3.0] String, Function, false
188- sortGroups: false , // [0.3.0] String, Function, false
189- sourceBind: false , // [0.5.0] Boolean
190- sourceHide: true , // [0.5.0] Boolean
191- startOpen: false , // [0.3.0] Boolean
192- stayOpen: false , // [0.3.0] Boolean
193- width: null , // [0.2.0] Integer, String, null
194- cbComplete: undefined , // [0.5.0] Function
195- cbEmpty: undefined , // [0.5.0] Function
196- cbLoopItem: undefined , // [0.4.0] Function
197- cbLoopGroup: undefined // [0.4.0] Function
198- });
69+ https://unpkg.com/browse/tail.select.js@1.1.0/
19970```
0 commit comments