2010-08-13 2 views
0

Это кажется очень простым и озадаченным, почему его не работает ... Я хочу изменить фоновое изображение DIV при перекатывании его. Он работает на хром и FF на макинтоше - но не FF, IE на ПКИзменение цвета фона при опрокидывании, не работающем в IE, FF

CSS - /media/css/mystandard.css

div.flipper {background-color: #FFFFFF;} 
div.flipper:hover {background-color: #F8FBFE;} 

HTML

<HTML> <HEAD> <link rel="stylesheet" href="/media/css/mystandard.css"/></HEAD><BODY>   
<div class="flipper" > 
hello stack overflow!    
</div> 
</BODY></HTML> 

Re: Сом

Спасибо за подсказку. К сожалению, я не могу использовать теги, потому что планирую иметь цвет фона полного изменения DIV (вроде как twitter.com Tweets view on rollover) и не хочу, чтобы весь текст в div был связан с

+1

FYI, ваш элемент HEAD не должен находиться внутри ТЕЛА. –

+0

aaah, вы правы, это было просто копия/вставка, опечатка - плохое исправление. – JiminyCricket

+1

он должен работать как на FF, так и на IE7 + PC, поэтому может возникнуть проблема, возможно, в том, как вы связываете свою таблицу стилей («import CSS here») - у нас есть полная страница или онлайн-тест? – darma

ответ

1

Если вы должны использовать <div>, вам нужно использовать JavaScript, чтобы сделать парение. Я предлагаю использовать JQuery для простоты:

$("div.flipper").hover(
    function() { $(this).addClass("hover"); }, 
    function() { $(this).removeClass("hover"); } 
); 

Затем измените CSS на:

div.flipper {background-color: #FFFFFF;} 
div.hover {background-color: #F8FBFE;} 
+0

где делать я поставил функцию JQuery? – JiminyCricket

+0

фигу поняли это спасибо! http://stackoverflow.com/questions/275891/jquery-hover-and- class-selector – JiminyCricket

+0

hmm его stil не работает на ПК ... – JiminyCricket

1

Не все браузеры поддерживают псевдо-атрибут hover на любом объекте, кроме привязанного тега <a>. Вы должны изменить что ты HTML для

<HTML><BODY> <HEAD> import CSS here </HEAD>  
<div class="flipper" > 
<a href="#"> 
hello stack overflow! 
</a>    
</div> 
</BODY></HTML> 

а ты Css в

div.flipper a{background-color: #FFFFFF;} 
div.flipper a:hover {background-color: #F8FBFE;} 
+0

спасибо, смотрите выше, я не могу использовать тегов = ( – JiminyCricket

0

вашей проблемы с вашей ссылки на CSS. У вас есть <link rel="stylesheet" href="/media/css/mystandard.css"/>

Первый фрагмент перед носителем создает проблему. Используйте это <link rel="stylesheet" href="media/css/mystandard.css"/>

Смежные вопросы