2013-08-03 2 views
0

Я создал изображение опрокидывания в Dreamweaver (творческое облако), но когда я просматриваю его в режиме реального времени, изображения не меняются при наведении.Ролловер не работает

Вот мой код:

<div id="facebook"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('facebook','','/images/facebookover.png',1)"><img src="/images/facebookup.png" id="facebook" /></a></div> 

и мой JavaScript

function MM_swapImgRestore() { //v3.0 
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; 
} 
</script> 
+0

Почему нет вы просто используете CSS и псевдокасс: hover? –

+1

Последний Dreamweaver в облаке Creative по-прежнему использует 'MM_swapImgRestore'? Это похоже на Dreamweaver в те времена, когда он все еще был разработан Macromedia. – insertusernamehere

ответ

1

Вы могли бы просто использовать CSS парение. Javascript не действительно требуется:

#facebook{ 
width:100px; 
height:100px; 
background-image:url('image1.jpg'); 
} 
#facebook:hover{ 
background-image:url('image2.jpg'); 
} 

Ваш HTML:

<div id="facebook">Text here</div> 

Рабочий пример: http://jsfiddle.net/NRFQ5/

+0

включая переходы: http://jsfiddle.net/NRFQ5/1/ – dsuess

+0

Работал отлично, спасибо. – lc2013

+0

@ lc2013 Обязательно отметьте ответ, если он работает :) – Sir

0

Если вы любите переходы, просто добавьте это к вашему стилю:

#facebook{ 
    transition: background-image 0.5s ease; 
    -moz-transition: background-image 0.5s ease; 
    -webkit-transition: background-image 0.5s ease; 
... 
}