Вот тогда код поподробнее. Если кто-нибудь меня тыкнет носом, где я не прав, буду очень признателен.
HTML
<form id="form1" action="" method="post" accept-charset="utf-8">
<div id="but1" class="but" onmouseover="mybut('but1', 1)" onmouseout="mybut('but1')" onmousedown="mybut('but1', 2)" onmouseup="mybut('but1', 1)" onclick="document.getElementById('form1').submit();">
<input id="but1_ns" class="but" type="submit" value="войти" />
<script type="text/javascript">jsbut('but1', 'войти');</script>
</div>
</form>
CSS
Код:
|
.but{position:absolute;width:100px;height:26px;cursor:pointer}
.jsbut{width:100px;height:24px;padding-top:2px;background-image:url("_ima/but.gif");text-align:center;font-size:12px} |
JS
function jsbut(elId, buttxt) {
var newDiv = document.createElement('div');
newDiv.className = 'jsbut';
newDiv.id = elId + '_js';
newDiv.innerHTML = buttxt;
document.getElementById(elId).replaceChild(newDiv, document.getElementById('but1_ns'));
}
function mybut(elId, flag) {
if (typeof flag == 'undefined') {flag = 0};
var elem = document.getElementById(elId + '_js').style;
switch (flag) {
case 0: elem.backgroundImage = 'url("_ima/but.gif")'; break;
case 1: elem.backgroundImage = 'url("_ima/but1.gif")'; elem.height = '24px'; elem.paddingTop = '2px'; break;
case 2: elem.backgroundImage = 'url("_ima/but2.gif")'; elem.height = '23px'; elem.paddingTop = '3px';
}
}