public
Last active

Fix for mouseout "losing" button state in JQuery buttons from http://www.filamentgroup.com/lab/styling_buttons_and_toolbars_with_the_jquery_ui_css_framework/

  • Download Gist
gistfile1.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40
<script type="text/javascript">
$(function() {
//all hover and click logic for buttons
$(".fg-button:not(.ui-state-disabled)").hover(
function() {
$(this).addClass("ui-state-hover");
if ($(this).data('__mousedown')) {
if($(this).is('.ui-state-active.fg-button-toggleable, .fg-buttonset-multi .ui-state-active'))
$(this).removeClass("ui-state-active");
else
$(this).addClass("ui-state-active");
}
},
function() { $(this).removeClass("ui-state-hover"); })
.mousedown(
function() {
$(this).data('__mousedown', true);
$(this).parents('.fg-buttonset-single:first').find(".fg-button.ui-state-active").removeClass("ui-state-active");
if($(this).is('.ui-state-active.fg-button-toggleable, .fg-buttonset-multi .ui-state-active'))
$(this).removeClass("ui-state-active");
else
$(this).addClass("ui-state-active");
})
.mouseup(
function() {
$(this).data('__mousedown', false);
if(!$(this).is('.fg-button-toggleable, .fg-buttonset-single .fg-button, .fg-buttonset-multi .fg-button'))
$(this).removeClass("ui-state-active");
})
.mouseout(
function() {
if(!$(this).is('.fg-button-toggleable, .fg-buttonset-single .fg-button, .fg-buttonset-multi .fg-button'))
$(this).removeClass("ui-state-active");
})
.click(
function() {
alert('clicked');
});
});
</script>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.