Skip to content

Instantly share code, notes, and snippets.

@xjamundx

xjamundx/meterPolyfill.css

Created November 8, 2011 00:21
Show Gist options
  • Save xjamundx/1346633 to your computer and use it in GitHub Desktop.
Save xjamundx/1346633 to your computer and use it in GitHub Desktop.
Download ZIP
jquery meter polyfill css
Raw
meterPolyfill.css
/******************
* Meter PolyFill
******************/
meter {
display: inline-block;
color: transparent;
height: 16px;
width: 100px;
overflow: hidden;
background: #ededed; /* Old browsers */
background: -moz-linear-gradient(top, #ededed 0%, #bbbbbb 36%, #f7f7f7 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(36%,#bbbbbb), color-stop(100%,#f7f7f7)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ededed 0%,#bbbbbb 36%,#f7f7f7 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ededed 0%,#bbbbbb 36%,#f7f7f7 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ededed 0%,#bbbbbb 36%,#f7f7f7 100%); /* IE10+ */
background: linear-gradient(top, #ededed 0%,#bbbbbb 36%,#f7f7f7 100%); /* W3C */
}
meter .indicator {
display: block;
height: 20px;
background: #b4e391; /* old browsers */
background: -moz-linear-gradient(top, #b4e391 0%, #44AA00 35%, #b4e391 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b4e391), color-stop(35%,#44AA00), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #b4e391 0%, #44AA00 35%, #b4e391 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #b4e391 0%, #44AA00 35%, #b4e391 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #b4e391 0%, #44AA00 35%, #b4e391 100%); /* IE10+ */
background: linear-gradient(top, #b4e391 0%, #44AA00 35%, #b4e391 100%); /* W3C */
}
.meterValueTooHigh div, .meterValueTooLow div {
background: #ffd65e; /* old browsers */
background: -moz-linear-gradient(top, #ffd65e 0%, #FBFF47 35%, #febf04 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffd65e), color-stop(35%,#FBFF47), color-stop(100%,#febf04)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffd65e 0%, #FBFF47 35%, #febf04 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffd65e 0%, #FBFF47 35%, #febf04 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffd65e 0%, #FBFF47 35%, #febf04 100%); /* IE10+ */
background: linear-gradient(top, #ffd65e 0%, #FBFF47 35%, #febf04 100%); /* W3C */
}
.meterIsMaxed
{
border-right: 0px none !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment