現在cssで私はこのようなものを持っています
.page-button, .generic-main
{/*medium color*/
background: #0B9444; /* Old browsers */
background: -moz-linear-gradient(top, #0dad50 0%, #0b9444 44%, #097a38 100%); /* FF3.6+*/
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0dad50), color-stop(44%,#0b9444), color-stop(100%,#097a38)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #0dad50 0%,#0b9444 44%,#097a38 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #0dad50 0%,#0b9444 44%,#097a38 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #0dad50 0%,#0b9444 44%,#097a38 100%); /* IE10+ */
background: linear-gradient(to bottom, #0dad50 0%,#0b9444 44%,#097a38 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0dad50', endColorstr='#097a38',GradientType=0 ); /* IE6-9 */
}
.page-button:hover, .generic-light
{/*light color*/
background: #97C193; /* Old browsers */
background: -moz-linear-gradient(top, #a8d6a3 0%, #97c193 44%, #8cb388 100%); /* FF3.6+*/
}
.generic-dark
{/*dark color*/
background: #08662F; /* Old browsers */
background: -moz-linear-gradient(top, #0a803b 0%, #08662f 44%, #075728 100%);/*FF3.6+*/
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0a803b), color-stop(44%,#08662f), color-stop(100%,#075728)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #0a803b 0%,#08662f 44%,#075728 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #0a803b 0%,#08662f 44%,#075728 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #0a803b 0%,#08662f 44%,#075728 100%); /* IE10+ */
background: linear-gradient(to bottom, #0a803b 0%,#08662f 44%,#075728 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a803b', endColorstr='#075728',GradientType=0 ); /* IE6-9 */
}
それからjqueryで私はこのようなものを持っています
$('page-button').live({
click: function () { submit();},
mousedown: function (){
$(this).addClass('generic-dark');
$(this).css('border', '1px #FF0000 solid');
},
mouseout: function (){
$(this).removeClass('generic-dark');
$(this).css('border', '0px');
}
});
私が欲しいのは、divが常にグラデーションの背景を持ち、完了したら元に戻ってグラデーションの背景を持つことです
誰かが何かアイデアを持っているなら事前に感謝します