Современные гипертекстовые информационные системы условно можно представить в виде совокупности нескольких компонентов: систем хранения гипертекстовых объектов, систем отображения гипертекстовых объектов, систем Читать полностью »

Увеличенная версия классического меню с изображением, сценарий добавляет распадающийся эффект в течение определенного времени. Сценарий работает во всех браузерах. Вы определили два изображения - одно всегда видимое, второе которое появится при наведении курсора мыши. Этот сценарий фактически довольно универсален в видах эффектов, которые он может воспроизвести. В то время как значение по умолчанию "распадается", еще 23 других перехода поддерживаются, все от "сильно ударяет в", " блок ", "постепенно появиться". Читать полностью »

Ошибка на ошибке
Ручное изменение названий файлов при изменении их содержимого - опасное занятие. Что произойдет, если вы переименуете файл, но забудете Читать полностью »

SSI является единственным нормальным способом вставки внешнего HTML-кода внутрь страницы. К сожалению, не на всех хостингах разрешено использование SSI, что связывает руки многим веб-мастерам.

Здесь я хочу предложить компромиссный вариант, а именно: вместо SSI использовать JavaScript. Сразу скажу, что так красиво, как с SSI, не получится, но, как говорится, "на безрыбье...". Читать полностью »

Скрипт на javascript, реализующий бегущую строку в статусной строке браузера

< html>

< head>

< SCRIPT LANGUAGE="JavaScript">

    var scrollCounter = 0;

 Читать полностью »

		

При помощи JavaScript можно создать достаточно красивый эффект падающего снега для вашего сайта. Если вы не хотите разбираться как работает скрипт, просто пролистайте статью до конца и скачайте пример. Читать полностью »

В последнее время стало популярным использование на сайте раскрывающегося древовидного меню. На самом деле такое меню очень легко построить, если знать принципы работы свойства display.

Давайте рассмотрим пример простейшего двухуровневого древовидного меню:

< style>

p { margin: 0px }
body { font-size: 11px; font-family: verdana; line-height: 17px }
.sub { padding-left: 20px; display: block }
.menu { cursor: pointer; display: block }
a { text-decoration: none; color: #000000 }

< /style>

< script language=JavaScript>

function show(obj) {

if (document.getElementById(obj).style.display == 'none')
document.getElementById(obj).style.display = 'block';
else document.getElementById(obj).style.display = 'none';

}

< /script>

< span class="menu" onclick="show('sub1')">+ Статьи< /span>

< span class="sub" id="sub1" style="display: none">
< p>< a href='http://www.webobzor.net'>Интернет< /a>< /p>
< p>< a href='http://www.webobzor.net'>JavaScript< /a>< /p>
< /span>

< span class="menu" onclick="show('sub2')">+ Рейтинг< /span>

< span class="sub" id="sub2" style="display: none">
< p>< a href='http://www.webobzor.net'>Главная< /a>< /p>
< p>< a href='http://www.webobzor.net'>Регистрация< /a>< /p>
< p>< a href='http://www.webobzor.net'>Статистика< /a>< /p>
< /span>

< span class="menu" onclick="show('sub3')">+ Форум< /span>

< span class="sub" id="sub3" style="display: none; border: 3px">
< p>< a href='http://www.webobzor.net'>Регистрация< /a>< /p>
< p>< a href='http://www.webobzor.net'>Cообщения< /a>< /p>
< p>< a href='http://www.webobzor.net'>Поиск< /a>< /p>
< /span>

Опустим описание стилей CSS. Здесь для вас все должно быть понятно: класс menu - пункт меню, sub - подпункт.

Рассмотрим подробнее код HTML. Каждый пункт меню представляет собой объект span. При нажатии на объект происходит обращение в функции show(obj), которая скрывает или отображает определенный объект. В нашем случае таким объектом является другой контейнер span, который содержит подпункты меню.

Теперь обратим свое внимание на свойство display. Оно может принимать несколько значений, но нас в первую очередь интересует display: block, который позволяет отображать содержимое контейнера в виде блок, который можно в любой момент скрыть (display: none). Однако в отличие от свойства visibility: hidden, при использовании display происходит скрытие объекта в прямом смысле, объект исчезает с экрана, а весь текст, который был под ним, смещается вверх.

При описание контейнера с подпунктами ему присваивается класс sub, который указывает, что данный контейнер является блоком:

.sub { padding-left: 20px; display: block }

Однако по умолчанию все подпункты должны быть скрыты:

< span class="sub" id="sub1" style="display: none">

Теперь при нажатии на соответствующий пункт меню, будет выполняться функция show, в качестве параметра будет передаваться указатель на объект span с соответствующим id.

Функция show определяет, скрытый ли блок, если да, отображает его, в протовном случае скрывает.

Пример:
Вы пришли с http://www.superbest.com/cgi-bin/tools/topsites.html
А броузер у Вас: microsoft internet explorer 4.0 (compatible; msie 5.01; windows nt 5.0)

< script language="javascript">

var where Читать полностью »

		

Не секрет, что, размещая в открытом виде на сайтах свои e-mail и icq адреса, мы рискуем попасть в списки спамеров и стать получателями нежелательной информации. Как же защитить информацию от ботов, в то же время сделав ее доступной для рядовых пользователей? Читать полностью »

Пример реализации скрипта на javascript для добавления страницы в «Избранное».

< html>
< head>
< script language="JavaScript">
   var bookmarkurl="http://www.softtime.ru/"
   var bookmarktitle="IT-студия SoftTime"

   function addbookmark()
   {
    if (document.all)
      window.external.AddFavorite(bookmarkurl,bookmarktitle)
   }
   if (document.all)
   document.write('< a href="javascript:addbookmark()">
    Нажмите на ссылку, чтобы добавить этот сайт в закладки')

< /script>
< /head>
< body>
< /body>
< /html>