-
Notifications
You must be signed in to change notification settings - Fork 299
Description
HI there,
First, thanks for this great plugin. It's really helping with the design of my site.
However, I can't get the default text to display at all.
I'm using wordpress
http://scorespacemusic.com/?page_id=74
and what's weird is that the fade options are working fine. Here's my code from footer.php
and although it's long, I'll paste in my jquery.selectBoxIt.css in case I'm obliterating it with a rule
/*
- jquery.selectBoxIt.css 3.4.0
- Author: @gregfranko
*/
/*
Common CSS Properties
These properties will be applied to any themes that you use
*/
/* SelectBoxIt container */
.selectboxit-container {
position: relative;
display: inline-block;
vertical-align: top;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 5px;
border: 1px solid #36393F;
}
/* Styles that apply to all SelectBoxIt elements */
.selectboxit-container * {
font: 12px Trebuchet, Arial, #989EAC;
font-color: #989EAC,
/* Prevents text selection */
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: -moz-none;
ms-user-select: none;
-o-user-select: none;
user-select: none;
outline: none;
white-space: nowrap;
}
/* Button /
.selectboxit-container .selectboxit {
width: 190px; / Width of the dropdown button */
cursor: pointer;
margin: 0;
padding-right: : 15px;
border-radius: 0px;
overflow: hidden;
display: block;
position: relative;
background: #36393F
}
/* Height and Vertical Alignment of Text /
.selectboxit-container span, .selectboxit-container .selectboxit-options a {
height: 20px; / Height of the drop down /
line-height: 20px; / Vertically positions the drop down text */
display: block;
font-color: #989EAC;
}
/* Focus pseudo selector */
.selectboxit-container .selectboxit:focus {
outline: 0;
}
/* Disabled Mouse Interaction */
.selectboxit.selectboxit-disabled, .selectboxit-options .selectboxit-disabled {
opacity: 0.65;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
cursor: default;
}
/* Button Text */
.selectboxit-text {
text-indent: 5px;
overflow: hidden;
text-overflow: ellipsis;
float: left;
color: #ffffff;
}
.selectboxit .selectboxit-option-icon-container {
margin-left: 5px;
}
/* Options List /
.selectboxit-container .selectboxit-options {
-moz-box-sizing: border-box;
box-sizing: border-box;
min-width: 90%; / Minimum Width of the dropdown list box options */
*width: 90%;
margin: 0;
padding: 0;
list-style: none;
position: absolute;
overflow-x: hidden;
overflow-y: auto;
cursor: pointer;
display: none;
z-index: 9999999999999;
border-radius: 6px;
text-align: left;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: #36393F
}
/* Individual options */
.selectboxit-option .selectboxit-option-anchor{
padding: 0 2px;
}
/* Individual Option Hover Action */
.selectboxit-option .selectboxit-option-anchor:hover {
text-decoration: none;
}
/* Individual Option Optgroup Header /
.selectboxit-option, .selectboxit-optgroup-header {
text-indent: 5px; / Horizontal Positioning of the select box option text */
margin: 0;
list-style-type: none;
}
/* The first Drop Down option */
.selectboxit-option-first {
border-top-right-radius: 6px;
border-top-left-radius: 6px;
}
/* The first Drop Down option optgroup */
.selectboxit-optgroup-header + .selectboxit-option-first {
border-top-right-radius: 0px;
border-top-left-radius: 0px;
}
/* The last Drop Down option */
.selectboxit-option-last {
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
}
/* Drop Down optgroup headers */
.selectboxit-optgroup-header {
font-weight: bold;
font-color: #989EAC;
}
/* Drop Down optgroup header hover psuedo class */
.selectboxit-optgroup-header:hover {
cursor: default;
}
/* Drop Down down arrow container /
.selectboxit-arrow-container {
/ Positions the down arrow */
width: 30px;
position: absolute;
right: 0;
}
/* Drop Down down arrow /
.selectboxit .selectboxit-arrow-container .selectboxit-arrow {
/ Horizontally centers the down arrow */
margin: 0 auto;
position: absolute;
top: 50%;
right: 0;
left: 0;
}
/* Drop Down down arrow for jQueryUI and jQuery Mobile */
.selectboxit .selectboxit-arrow-container .selectboxit-arrow.ui-icon {
top: 30%;
}
/* Drop Down individual option icon positioning */
.selectboxit-option-icon-container {
float: left;
}
.selectboxit-container .selectboxit-option-icon {
margin: 0;
padding: 0;
vertical-align: middle;
}
/* Drop Down individual option icon positioning */
.selectboxit-option-icon-url {
width: 18px;
background-size: 18px 18px;
background-repeat: no-repeat;
height: 100%;
background-position: center;
float: left;
}
/* jQueryUI and jQuery Mobile compatability fix - Feel free to remove this style if you are not using jQuery Mobile */
.jqueryui .ui-icon {
background-color: inherit;
}
/* Another jQueryUI and jQuery Mobile compatability fix - Feel free to remove this style if you are not using jQuery Mobile */
.jqueryui .ui-icon-triangle-1-s {
background-position: -64px -16px;
}
/*
Default Theme
Note: Feel free to remove all of the CSS underneath this line if you are not using the default theme
/
.selectboxit-btn {
background-color: #36393F;
color: white;
/
background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
background-repeat: repeat-x;
/
/
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 5px solid #878787;
/
/ padding: 5px; /
/ border-color: #e6e6e6 #e6e6e6 #bfbfbf; /
/ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); /
/ border-bottom-color: #b3b3b3; */
}
.selectboxit-btn.selectboxit-enabled:hover,
.selectboxit-btn.selectboxit-enabled:focus,
.selectboxit-btn.selectboxit-enabled:active {
color: #333333;
background-color: #565a62;
}
.selectboxit-btn.selectboxit-enabled:hover,
.selectboxit-btn.selectboxit-enabled:focus {
color: #333333;
background-position: 0 -15px;
}
.selectboxit-default-arrow {
width: 0;
height: 0;
border-top: 4px solid #000000;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
.selectboxit-list {
background-color: #ffffff;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.selectboxit-list .selectboxit-option-anchor {
color: #989EAC;
text-decoration: none;
}
.selectboxit-list > .selectboxit-focus > .selectboxit-option-anchor {
color: #ffffff;
background-color: #0081c2;
background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
background-image: -o-linear-gradient(top, #0088cc, #0077b3);
background-image: linear-gradient(to bottom, #0088cc, #0077b3);
background-repeat: repeat-x;
}
.selectboxit-list > .selectboxit-disabled > .selectboxit-option-anchor {
color: #999999;
}