Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Default Text option not functioning #165

Closed
musigeek opened this issue May 6, 2013 · 2 comments
Closed

Default Text option not functioning #165

musigeek opened this issue May 6, 2013 · 2 comments
Assignees
Labels

Comments

@musigeek
Copy link

musigeek commented May 6, 2013

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

<script type='text/javascript'> (function($) { $(".wpv-filter-form select").selectBoxIt({ defaultText:"all" , showEffect: "fadeIn", showEffectSpeed: "fast", hideEffect: "fadeOut", hideEffectSpeed: "fast", }); // Change upon selection, no submit button needed $(".wpv-filter-form select").change(function() { this.form.submit(); }); })(jQuery); </script>

and although it's long, I'll paste in my jquery.selectBoxIt.css in case I'm obliterating it with a rule

/*

/*
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;
}

@ghost ghost assigned gfranko May 9, 2013
@gfranko
Copy link
Owner

gfranko commented May 10, 2013

There was a bug in SelectBoxIt with how it handled the defaultText option when there was a selected attribute within one or more of the select box options. This has now been fixed and you can grab the latest v3.5.0 JS file here.

@gfranko gfranko closed this as completed May 10, 2013
@musigeek
Copy link
Author

Ok, thanks so much Greg

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants