К сожалению, : псевдо-селектор hover не поддерживается IE6 на любом другом элементе, кроме <a>.
Если вы хотите реализовать: парить на IE6, вы можете:
а) Если возможно, измените ваш <input class="btnNewL1" type="button" value="click me!" /> на <a class="btnNewL1" href="#">click me!</a>. Вам нужно будет добавить display: block и несколько других правил CSS. Это будет просто «имитировать» кнопку, используя тег <a>. Это не идеальное решение, потому что иногда вы должны использовать правильный <input> (то есть при использовании элементов управления asp.net).
б) Использование Javascript, чтобы обойти, например, в JQuery является:
<script type="text/javascript">
$(document).ready(function(){
$("input.btnNewL1").mouseover(function(){
$(this).toggleClass('buttonSelected');
}).mouseout(function(){
$(this).toggleClass('buttonSelected');
});
});
</script>
<input type="button" value="click me!" class="btnNewL1" />
с) Оберните ваш код, что:
<a class="acont" href="#"><input type="button" value="click me!" /></a>
Таким образом, вы будете иметь возможность использовать CSS:
.acont:hover input { background:red; }
Это выполнит эту работу, но насколько я помню, это недействительно. HTML (<input> не следует размещать внутри метки <a>)
Какой из них выберете - до вас. Главным моментом этого сообщения является, опять же: : псевдо-селектор hover можно использовать только для элементов IE6 на опорных элементах
В большинстве случаев эффект опрокидывания не имеет большого значения для меня, чтобы беспокоиться о совместимом с IE6 решении. Но ОП упомянул IE6, и я даю вам +1 для решения проблем вокруг этого. –
спасибо Стив. Я тоже думаю, но мы все равно должны помнить об IE6, потому что многие люди используют его. О, и btw я отредактировал мой пост, так что теперь есть три решения. – rochal