<div> + hover картинка.. има ли възможност?

[jaffy]

Има ли накаква възможност background картинката на <div> да бъде с hover ефект?

Ето какво съм направил до сега:

<html>
<head>
<LINK href="coolc.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
function web_on(){
var myButton8 = document.getElementById('myButton8');
myButton8.src = 'images/web1_03.png';
}
function web_off(){
var myButton8 = document.getElementById('myButton8');
myButton8.src = 'images/web1_01.png';
}
</script>
</head>
<body>
<div class="web1" onmouseover="web_on()" onmouseout="web_off()" id="myButton8"></div></td>
</body>
</html>

CSS код:

div.web1 {
background: url('images/web1_01.png');
height: 344px;
width: 113px
}

 

[emagi]

Е добре де, виж сега къде ти е грешката:задаваш в CSS:

background: url('images/web1_01.png');

а после търсиш src="..." на изображение.КОе е то?
Трябва да стане така:
CSS код:

CSS код:
Код:
div.web1 {
background-image:url(images/web1_01.png);
height: 344px;
width: 113px
}

ПОсле имаш следния html документ:

<html>
<head>
<LINK href="coolc.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
function web_on(){
var myButton8 = document.getElementById('myButton8');
myButton8.style.backgroundImage = "url('images/web1_03.png')";
}
function web_off(){
var myButton8 = document.getElementById('myButton8');
myButton8.style.backgroundImage = "url('images/web1_01.png')";
}
</script>
</head>
<body>
<div class="web1" onmouseover="web_on()" onmouseout="web_off()" id="myButton8"></div>
</body>
</html>

 

[jaffy]

Още един път ти БЛАГОДАРЯ от все сърце!

+1