на главную

Всплывающие подсказки

Рассмотрим пример всплывающих подсказок,в котором
подсказка будет появляться после щелчка на гиперсылках.
Код сценария всплывающих подсказок
<script language="JavaScript">
function showtopic(n) {
var cdesc;
switch(n)
{
case1:
cdesc="<img src='сip.jpg'>";
break;
case2:
cdesс="<img src='cat.jpg'>";
break;
default:
cdesc="По гиперсылкам надо щелкать";
}
desc.innerHTML=cdesc;
}
</script> `
</head>
<body>
<table><tr>
<td bgcolor="yellow" width="100">
<p><a href="JavaScript:showtopic(1)">Картинка1</a></p>
<p><a href="JavaScript:showtopic(2)">Картинка2</a></p>
</td>
<td bgcolor="yellow" width="128">
<p id="desc"><center>Картинки</p> </td> </tr></table>

Картинка1

Картинка2

Картинки

Всплывающим окнам соответствует объект popup.
Он поддерживается IE начиная с5.5 с помощью метода window.createPopup().
Объекту Popup назначаются требуемые свойства с помощью style.

СВОЙСТВА ОБЪЕКТА POPUP

Заполнение всплывающего окна содержимым производится с помощью свойства innerHTML,принимающего в качестве
значения строку,содержащую теги HTML.
Например: mupopup.document.body.innerHtml="<img src='cartinca.jpg'>"

Код сценария всплывающих окон:

<script type="text/JavaScript">
var mypopup=window.createPopup()/*создание всплывающего окна*/
var popupBody=mypopup.document.body/*сохранили в переменной для краткости*/
/*Параметры окна*/
popupBody.style.border="solid 2px green"
popupBody.style.color="blue"
function pop(xcontent){
/*Заполнение содежимым*/
popupBody.innerHTML="<p>"+xcontent +"<p>"
/*вывод всплывающего окна*/
mypopup.show(500,90,400,200,document.body)
}
</script></head>
<body>
<button onclick="pop('Здесь должно быть то,что вы захотите разместить')">Просто текст </button>


Нажав на кнопку"Просто текст" всплывет окно

Сайт управляется системой uCoz