Css изображение поменять при наведении мыши

Question

Css изображение поменять при наведении мыши

0

Привет, я получил следующий код ниже, но изображения мерцают, когда мышь закончилась. Кто-нибудь знает, как я могу это исправить?

<a href="#"  tagtype="StoreLink" title="Playstation 4"><img alt="" class="baseImage"      src="https://merchanttoolbox.play.com/resources/merchant/19825548/72356.jpg" title="" /><img  alt="" class="rollOver" src="https://merchanttoolbox.play.com/resources/merchant/19825548/72357.jpg" title="" /></a>



<style>

.rollOver {display:none;} 
.baseImage:hover {display:none;} 
.baseImage:hover~.rollOver {display: inherit;}  

</style>

pud 20 март 2014, в 16:34

Источник

Теги:

html

css

1 ответ

Ещё вопросы

Andy · Accepted Answer · 2014-03-20T12-56-00.000Z

0

Лучший ответ

Я бы лично поставил парить на родительском a как это всегда будет видно, и вы с меньшей вероятностью сталкиваются с такого рода проблемами.

JSFiddle

Andy 20 март 2014, в 12:56

0

который отлично работает в dreamwever и мой браузер , но не здесь play.com/store-preview/12b44b4f-8d0c-415d-8a67-a413ae7ad662/... которым нечетный первый метод работал , но с мерцанием, любые IDIA почему , может быть , или как может я чиню это?
pud 20 март 2014, в 16:59
0

@pud Какой CSS используется? Я вижу, что HTML-код правильный, но я не могу найти ни одного правильного класса в файлах CSS.
Andy 20 март 2014, в 17:12
0

Я должен использовать игры на компоновщике страниц, поэтому я получаю пробники, я только что проверил код, и он испортил css, что со всеми & lt; br & gt ??
pud 20 март 2014, в 17:30
0

<style> .hover .baseImage {& lt; br & gt; display: block; & lt; br & gt;} & lt; br & gt; .hover .rollOver {& lt; br & gt; дисплей: нет; & lt; br & gt;} & lt; br & gt;. & hover; hover: hover .rollOver {& lt; br & gt; display: block; & lt; br & gt;} & lt; br & gt; & lt; br & gt; .hover: hover .baseImage {& lt; br & gt; дисплей: нет; & lt; br & gt;} & lt; br & gt; & lt; br & gt; </ style>
pud 20 март 2014, в 17:31
0

@pud Является ли конструктор страниц редактором WYSIWYG? Если это так, то проблема в том, что редактор, вероятно, пытается кодировать CSS. Это отдельная проблема.
Andy 20 март 2014, в 17:36
0

да, это WYSIWYG редактор, есть опция для просмотра сгенерированного HTML, и я скопирую туда HTML и CSS
pud 20 март 2014, в 17:46
0

@pud У меня нет большого опыта работы с этими редакторами, но я добавил еще один ответ с решением, которое может работать лучше для вас.
Andy 20 март 2014, в 19:09
0

@pud, если вы не можете использовать javascript, попробуйте удалить разрывы строк из стилей, это может быть тем, что редактор пытается закодировать: jsfiddle.net/Bkw9t/5
Andy 21 март 2014, в 09:32
0

@pud Помогло ли вам это решение?
Andy 25 март 2014, в 11:02
0

Огромное спасибо за всю эту помощь, это была разрывы строк. Еще одна проблема, теперь переворачивание работает, если вы перемещаетесь вверх и вниз снизу или слева, но не если вы входите и выходите справа, я предполагаю, что это имеет что-то делать со скрытым изображением, есть идеи, как это исправить
pud 26 март 2014, в 11:49
0

@pud Ах, не беспокойся, приятель. Я думаю, что проблема, которую вы описываете, заключается в том, что a занимает всю ширину своего родителя. Вы можете исправить это, добавив float: left; смотрите здесь: jsfiddle.net/Bkw9t/7
Andy 26 март 2014, в 12:38
0

@pud Кроме того, если бы мой ответ помог вам, было бы замечательно, если бы вы могли пометить как принятый. Ура :)
Andy 26 март 2014, в 12:39
0

да офигенно спасибо что проснулся !!!
pud 26 март 2014, в 14:46
0

я просто нажму на галочку?
pud 26 март 2014, в 14:47

Показать ещё 12 комментариев