Меняем цвет фона страницы

В этом примере показано как можно поменять фон страницы при наведении курсора мышки на прямоугольник соответствующего цвета. Правда в нашем случае цвет фона body перекрывается цветом других слоев и потому была использована следующая функция:

function bgChange(bg) {
 document.getElementById("question_show").style.background = bg;
}

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

<html>
<head>
<script>
function bgChange(bg) {
 document.body.style.background = bg;
}
</script>
</head>
<body>
<h2>Меняем цвет фона</h2>
<p>Наведите курсор на прямоугольник</p>
<table style="width:150px;height:50px;">
 <tr>
 <td onmouseover="bgChange(this.style.backgroundColor)" 
 onmouseout="bgChange('transparent')"
 style="background-color:Khaki">
 </td>
 <td onmouseover="bgChange(this.style.backgroundColor)" 
 onmouseout="bgChange('transparent')"
 style="background-color:PaleGreen">
 </td>
 <td onmouseover="bgChange(this.style.backgroundColor)" 
 onmouseout="bgChange('transparent')"
 style="background-color:Silver">
 </td>
 </tr>
</table>
</body>
<⁄html>

Попробуйте скрипт в действии - наведите курсор на цветной прямоугольник.

Похожие публикации: JavaScript

Войти и комментировать [ Вход | Регистрация ]