Изменение изображения при наведении
Здравствуйте. Появилась необходимость сделать следующее. Есть изображение (логотип), нужно чтобы при наведении он менялся на тот же логотип только в другом цвете. При следующем наведении он снова менялся на логотип еще одного цвета. Всего таких цветов 4. То есть будет 4 одинаковых изображения, отличающихся только цветом и нужно чтобы они поочередно циклично друг друга сменяли при наведении. Как это реализовать при помощи javacript?
|
var i = 1; element.src = i + '.png'; i = i == 4 ? 1 : i + 1; |
<script type = "text/javascript">
window.onload = function(){
// Массив путей к картинкам:
arr = new Array( 'img1.jpg',
'img2.jpg',
'img3.jpg',
'img4.jpg'
);
num = 0;
document.getElementById( "logo" ).onmouseover =
function(){
this.src = arr[ num ];
if( num == arr.length - 1 )
num = 0;
else
num++;
}
}
</script>
<!-- Наш логотип: -->
<img id = "logo" src = "img1.jpg" alt = "logo">
|
В ie не работает 6-9 версиях. Есть другой способ добиться такого эффекта?
|
Цитата:
|
| Часовой пояс GMT +3, время: 23:49. |