|
Содержание:
Об этой книге Введение
в HTML Нужные программы
Шрифты, размер Гиперссылки
Цвет Таблицы
Вставляем картинку
Работаем с фоном
Спецсимволы Фреймы
Слои стили,
CSS SSI Локальный
сервер JavaScript
понятия
специальные теги: title=
alt=
| |
|
|
JavaScript |
К сожалению, Java-скрипты поддерживаются
не всегда корректно разными броузерами, излишне загромождают
странички и вообще, являются чем-то вроде промежуточного звена
между чистым HTML и более функциональным чем Java - PHP.
Но тем не менее, для сайтов начального
уровня, чей бесплатный хостинг не дает, как правило, ни PHP,
ни CGI, JavaScript почти незаменимое средство сделать сайт поживее,
динамичнее..
Я приведу тут несколько примеров
скриптов, но вдаваться во все детали не буду - ведь книга-то
об HTML, а не скриптах, про них можно написать отдельную, втрое
большую этой, книгу. Итак, простенький скриптик
смены картинок на кнопках: Чтобы понимать, о
чем идет речь, начнем с примера -
наведи мышку на эту кнопку (да, в Мозилле и Нетшкапе фильтров-то
нет - так что если ты не под плорером, то пролистывай эту главу
- скрипты тебе вообще будут малоинтересны :0)):
А если при наведении мышки на кнопку та изменилась, то продолжим:
начало JavaScript`а внутри странички обозначается примерно как:
<SCRIPT language=JavaScript1.2>
(это обозначает начало скрипта и версию команд, на которых
он построен)
Теперь сам скрипт:
function high(which2)
это название функции и процедура (то, что ниже):
{стандартно - открытие последовательности параметров. theobject=which2
//
назначен объектwhich2
highlighting=setInterval("highlightit(theobject)",50)
"освещение"=НазначитьИнтервал("подсветить(объект)",50)
- "50" - это, собственно, сама величина интервала.
ее можно поменять на иное значение - увидите изменения в
работе скрипта.
.. и закрытие последовательности параметров:
}
функция "бледности"
function low(which2)
{
сие толкуем примерно как:
clearInterval(highlighting)
очистка интервала("освещения")
which2.filters.alpha.opacity=20
"имярёк2.Фильтруем.Альфа.засвеченность=20"
}
Функция яркости (фиг его знает что)
function highlightit(cur2)
{
if (cur2.filters.alpha.opacity<100)
если (фиг его знает что фильтрует яркость меньше 100 единиц)
cur2.filters.alpha.opacity+=20
(к фиг его знает чему фильтровать на +20 сильнее)
else if (window.highlighting)
если не так, то (запускаем освещабельность)
clearInterval(highlighting)
очищаем интервал (освещабельности)
}
</SCRIPT>
(кАнЭц скрЫпта)
примерно так.
теперь... рассмотрим обращение к скрипту с объекта его приложения:
как известно, картинку мы указываем как <img
onMouseOver=high(this) style="FILTER: alpha(opacity=25)"
onMouseOut=low(this) height=31 alt="надпись"
width=88 border=0 src="путь к картинке.gif">
Читается это так: <img - начало картинки.
onmouseover=high(this)
при наведении мышки - включить нашу функцию high (см.
первый абзац скрипта) style="FILTER: alpha(opacity=25)
стиль отображения картинки - фильтр прозрачности - 25% непрозрачности
(из 100) onmouseout=low(this)
как только курсор съедет с территории картинки - исполнить функцЫю
low (найди в скрипте сам). src="/N/srez88x31b.gif"
ну - это, собсно, та самая картинка,
где src расшифровываеЦЦа как сокращение от английского source
и в кавычках опосля знака "=" - тривиальный
путь к картинке. width="83" height="31"
-
размеры картинки. Если их не задать она будет
отражена в масштабе 1:1, если задать не такими, как родные размеры
картинки, получим искажение.
alt="любой текст, который будет виден,
если картинка не загрузится"
ну и закрытие тега картинки в виде непременного: >
для тех, кто в танке:
впендюриваем это <SCRIPT language=JavaScript1.2>
function high(which2){
theobject=which2
highlighting=setInterval("highlightit(theobject)",50)
}
function low(which2){
clearInterval(highlighting)
which2.filters.alpha.opacity=20
}
function highlightit(cur2){
if (cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=20
else if (window.highlighting)
clearInterval(highlighting)
}
</SCRIPT>в самое начало паги прямо под тег </head>
затем берем это
<IMG onmouseover=high(this) style="FILTER: alpha(opacity=25)"
onmouseout=low(this) src="/NAVI/foox88x3s1.gif" width="83"
height="31" alt="мАя кЫнопкА :0)">
и впендюриваем на то место паги, где должна быть кнопка, промеж
тегов <body>
</body>
где планируем нашу картинку.
возможные глюки: перекосило картинку:
размеры ты указал неправильно (если картинку иную попробуешь
запихать)
картинка не отображается вообще
путь к ней не верен - убедись, что страничка со скриптом в одной
директории с картинкой и проверь, правильно ли названа картинка.
Если ты напишешь ее как pict.JPG - это не значит что
она прочтется как pict.jpg!
удач в нелегком опыте :0)
да... скрипты, как и стили, лучше и правильнее хранить в отдельном
файле, а вызывать его можно такой строкой сразу под строкой
вызова стиля - <SCRIPT language=JavaScript1.1
src="menu.js"> </SCRIPT>
Чуть позже выйдет книга по скриптам с кучей примеров :0) |
<<
Локальный сервер |
Тег
title >> |
|
|
|
|
|
|
Рекомендую посетить:
|