WEB-программирование: "Java Script(JS): Работа с CSS. Продолжение-4".

Урок 13. Управление шрифтами в CSS New Page 1

Сегодня мы рассмотрим пример изменения стиля форматирования фона. У нас есть фоновое изображение, поверх него текст:

По клику мышки изображение меняется на зеркальное:

Вот код данной программы:

<html>

<head>

<title>Урок 135. Java Script (JS): Изменение стиля форматирования фона</title>

div

{

background-image:url(right.png);

background-repeat:repeat-x;

font-size:180%;

}

</STYLE>

function my_click()

{

var st=document.styleSheets[0];

var rule=(st.rules) ? st.rules[0] : st.cssRules[0];

if(rule.style.backgroundImage=='url("right.png")')

{

rule.style.backgroundImage='url(mirror.png)'

}

else

{

rule.style.backgroundImage='url(right.png)'

}

</SCRIPT>

</head>

<body>

Текст внутри этого контейнера расположен поверх фонового изображения, которое меняется по клику мышки<br>

</div>

</body>

</html>

Здесь мы при помощи CSS стиля задаем фоновое изображение, а скриптом меняем его.

Последнее обновление ( 13.11.2021 г. )

Пред. »