Skip to content

Commit 85a10ca

Browse files
committed
Fixed README
1 parent 5ec029b commit 85a10ca

File tree

7 files changed

+177
-351
lines changed

7 files changed

+177
-351
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@ node_modules
33
.npm-debug.log
44
tmp
55
.sass-cache
6+
.gitdown

.publish

Lines changed: 0 additions & 1 deletion
This file was deleted.

README.md

Lines changed: 12 additions & 193 deletions
Original file line numberDiff line numberDiff line change
@@ -25,197 +25,10 @@ Include **jQuery Selectric:**
2525
<script src="js/jquery.selectric.min.js"></script>
2626
```
2727

28-
Put styles in your CSS and change it to your taste :D
29-
30-
```css
31-
/*======================================
32-
Selectric
33-
======================================*/
34-
.selectricWrapper {
35-
position: relative;
36-
cursor: pointer;
37-
}
38-
39-
.selectricResponsive {
40-
width: 100%;
41-
}
42-
43-
.selectric {
44-
border: 1px solid #DDD;
45-
background: #F8F8F8;
46-
position: relative;
47-
}
48-
.selectric .label {
49-
display: block;
50-
white-space: nowrap;
51-
overflow: hidden;
52-
text-overflow: ellipsis;
53-
margin: 0 38px 0 10px;
54-
font-size: 12px;
55-
line-height: 38px;
56-
color: #444;
57-
height: 38px;
58-
}
59-
.selectric .button {
60-
display: block;
61-
position: absolute;
62-
right: 0;
63-
top: 0;
64-
width: 38px;
65-
height: 38px;
66-
color: #BBB;
67-
text-align: center;
68-
font: 0/0 a;
69-
*font: 20px/38px Lucida Sans Unicode, Arial Unicode MS, Arial;
70-
}
71-
.selectric .button:after {
72-
content: " ";
73-
position: absolute;
74-
top: 0;
75-
right: 0;
76-
bottom: 0;
77-
left: 0;
78-
margin: auto;
79-
width: 0;
80-
height: 0;
81-
border: 4px solid transparent;
82-
border-top-color: #BBB;
83-
border-bottom: none;
84-
}
85-
86-
.selectricHover .selectric {
87-
border-color: #C4C4C4;
88-
}
89-
.selectricHover .selectric .button {
90-
color: #A2A2A2;
91-
}
28+
Include **jQuery Selectric:** styles, and change it to your taste :D
9229

93-
.selectricOpen {
94-
z-index: 9999;
95-
}
96-
.selectricOpen .selectric {
97-
border-color: #C4C4C4;
98-
}
99-
.selectricOpen .selectricItems {
100-
display: block;
101-
}
102-
103-
.selectricDisabled {
104-
filter: alpha(opacity=50);
105-
opacity: 0.5;
106-
cursor: default;
107-
-webkit-user-select: none;
108-
-moz-user-select: none;
109-
-ms-user-select: none;
110-
user-select: none;
111-
}
112-
113-
.selectricHideSelect {
114-
position: relative;
115-
overflow: hidden;
116-
width: 0;
117-
height: 0;
118-
}
119-
.selectricHideSelect select {
120-
position: absolute;
121-
left: -100%;
122-
display: none;
123-
}
124-
125-
.selectricInput {
126-
position: absolute !important;
127-
top: 0 !important;
128-
left: 0 !important;
129-
overflow: hidden !important;
130-
clip: rect(0, 0, 0, 0) !important;
131-
margin: 0 !important;
132-
padding: 0 !important;
133-
width: 1px !important;
134-
height: 1px !important;
135-
outline: none !important;
136-
border: none !important;
137-
*font: 0/0 a !important;
138-
background: none !important;
139-
}
140-
141-
.selectricTempShow {
142-
position: absolute !important;
143-
visibility: hidden !important;
144-
display: block !important;
145-
}
146-
147-
/* Items box */
148-
.selectricItems {
149-
display: none;
150-
position: absolute;
151-
top: 100%;
152-
left: 0;
153-
background: #F8F8F8;
154-
border: 1px solid #C4C4C4;
155-
z-index: -1;
156-
box-shadow: 0 0 10px -6px;
157-
}
158-
.selectricItems .selectricScroll {
159-
height: 100%;
160-
overflow: auto;
161-
}
162-
.selectricAbove .selectricItems {
163-
top: auto;
164-
bottom: 100%;
165-
}
166-
.selectricItems ul, .selectricItems li {
167-
list-style: none;
168-
padding: 0;
169-
margin: 0;
170-
font-size: 12px;
171-
line-height: 20px;
172-
min-height: 20px;
173-
}
174-
.selectricItems li {
175-
display: block;
176-
padding: 8px;
177-
border-top: 1px solid #FFF;
178-
border-bottom: 1px solid #EEE;
179-
color: #666;
180-
cursor: pointer;
181-
}
182-
.selectricItems li.selected {
183-
background: #EFEFEF;
184-
color: #444;
185-
}
186-
.selectricItems li:hover {
187-
background: #F0F0F0;
188-
color: #444;
189-
}
190-
.selectricItems .disabled {
191-
filter: alpha(opacity=50);
192-
opacity: 0.5;
193-
cursor: default !important;
194-
background: none !important;
195-
color: #666 !important;
196-
-webkit-user-select: none;
197-
-moz-user-select: none;
198-
-ms-user-select: none;
199-
user-select: none;
200-
}
201-
.selectricItems .selectricGroup .selectricGroupLabel {
202-
font-weight: bold;
203-
padding-left: 10px;
204-
cursor: default;
205-
-webkit-user-select: none;
206-
-moz-user-select: none;
207-
-ms-user-select: none;
208-
user-select: none;
209-
background: none;
210-
color: #444;
211-
}
212-
.selectricItems .selectricGroup.disabled li {
213-
filter: alpha(opacity=100);
214-
opacity: 1;
215-
}
216-
.selectricItems .selectricGroup li {
217-
padding-left: 25px;
218-
}
30+
```html
31+
<link rel="stylesheet" href="selectric.css">
21932
```
22033

22134
Initialize **jQuery Selectric:**
@@ -230,6 +43,13 @@ $(function(){
23043

23144
##Options:
23245

46+
You can pass an options object as the first parameter when you call the plugin. For example:
47+
```js
48+
$('select').selectric({
49+
maxHeight: 200
50+
});
51+
```
52+
23353
```js
23454
{
23555
/*
@@ -305,7 +125,7 @@ $(function(){
305125
* Type: String [HTML]
306126
* Description: Markup for open options button
307127
*/
308-
arrowButtonMarkup: '<b class="button">&#x25be;</b>',
128+
arrowButtonMarkup: '&lt;b class=&quot;button&quot;&gt;&amp;#x25be;&lt;/b&gt;',
309129

310130
/*
311131
* Type: Boolean
@@ -353,7 +173,7 @@ $(function(){
353173

354174
/*
355175
* Type: String or Function
356-
* Description: Define how each option should be rendered inside its <li> element.
176+
* Description: Define how each option should be rendered inside its &lt;li&gt; element.
357177
*
358178
* If it's a string, all keys wrapped in brackets will be replaced by
359179
* the respective values in itemData. Available keys are:
@@ -455,7 +275,6 @@ $.fn.selectric.hooks.add('callbackName', 'hookName', function(element, data) {})
455275
$.fn.selectric.hooks.remove('callbackName', 'hookName');
456276
```
457277

458-
459278
##Public methods:
460279

461280
```js

0 commit comments

Comments
 (0)