логотип

Всяк кулик свое болото хвалит...
Любовь зла, полюбишь и козла...

© Народ.ru

Привет :-) Уже забыли Смотрителя? А Смотритель вас не забыл :-)

Если кого-то случайно удивил наш сегодняшний эпиграф, то не расстраивайтесь - меня он тоже поначалу удивлял ;-) Но дело в том, что сегодня Смотритель затронет действительно душещипательную тему любви... как это не странно звучит в отношении WEB-программирования.

Спасибо всем, кто написал Смотрителю, спасибо за хвалебные отзывы и за здоровую критику %-) Очень приятно было заметить, что Рунет, несмотря на то, что жизнь улучшается (как я писал в прошлом выпуске), сохраняет веселый дух черного юмора в своих трепещущих сердцах ;-) Это просто здорово :-).

Поведаю-ка вам, друзья, о некоторых новшествах, кои я внес в рассылку... Во-первых, глядя, как она выглядит в офф-лайне из-под MS Otpook Express'a, я просто ужаснулся %-0! Листочек-то со стилями валялся на далеком narod'е.ru, который в офф-лайне, к сожалению, пока недоступен ;-) (Кстати, надо бы занять доменное имя "Крошка.ru", и разместить там сайт о жизни редких австралийских животных;-) ). В обчем, для увеличения удобочитаемости рассылки, я сделал альтернативный каскадный лист стилей, который подключается, когда она просматривается в офф-лайне. Его можно скачать тут (а можно и не скачивать, если уж очень страшно). После этого его надо занести в директорий c:\temp (хехе, я бы конечно сделал с удовольствием и в c:\windows, да понял потом, что самые пугливые туда вообще не лазят ;-) ). И - voila! Картинок, правда, все одно не прибавится, но все же - дареному коню зад не щупают ;-) (недареному, кстати, тоже не советую)...

Ладно, хватит мучать вас своими излияниями, передаю...

Итак, дорогие мои детишечки, сегодня у нас весьма и весьма забавная почта завалялась в моей дырявой шапочке (Шарик, охотник, тудыть его растудыть:-) )

Вот есть тут душещипательное письмо от Петечки...

Петечка: Дяденька Смотритель, что же вы делаете?! Я очень люблю Дашеньку, она меня тоже, но и Netscape Navigator я тоже люблю %-( А она, как узнала от вас, как рисовать меняющиеся кнопочки под IE, так от моего Navigator'а нос воротит! Помогите, плиз...
(далее письмо залито горючими слезами, и прочесть остатки его не представляется возможным)

Ответ Петечке и Дашеньке

Эх, Дашенька, Дашенька... Как говорится, любовь зла ;-)
Ну ладно, дети мои, подсоблю вашему горю по возможности малой %-) , к тому же я близко знаком с надвигающейся демографической катастрофой и вовсе не намерен сокращать прирост поголовья гомо-сапинцев, разрушая намечающуюся семью :-) Итак, действительно, можно сделать кнопочки, которые будут корректно подмигивать нам при наведении мышкой почти под любым браузером (ох, нравится мне это слово "почти", за которым могут скрываться хоть половина браузеров мира ;-)). Так что беда твоя, Петечка, это и не беда вовсе... Просто твой любымый NN (иногда я пишу NC по старой аналогии с командиром Нортоном) не любит свойств onmouseover и onmouseout у тэга <img>, такой вот он зараза! Ну да это можно исправить - просто обрамив этот самый <img> парой тэгов <a> и </a>, которые такие свойства поддерживают. Вот так:

<a href="куда_пойдем_отсюда" onMouseOver="lite(0)" onMouseOut="dark(0)">
<img name="button0" src="темный_кнопыш" border=0>
</a>
Эти строчечки ты, Петечка, будешь писать там, где вы с Дашенькой будуте размещать свои совместные универсальные мигающие нам ласково кнопочки. Что ж, добавка сотни символов на одну кнопочку - не такая уж большая цена за универсальность и спасенную семью :-) Но, не думай, что ты самый хитрый, а то бывают такие весельчаки использовать Anchor'ы как пустой контейнер, не вписывая свойства href, в NN это не протянет. Так что, придется явно и бордерок занулить, а то возникнет вокруг вашей с Дашенькой кнопочки неприятная синяя рамочка.

Заодно немного перепишем и скриптовый код, что бы Петечкины странички не были похожи на Дашенькины - долой однообразие!

<script language='javascript'>
<!--
b_lite=new Array(); //массивчик со "светлыми" рисунками
b_dark=new Array(); //аналогичный - с "темными"

b_lite[0]=new Image(ширина_рисунка,высота_рисунка);
b_dark[0]=new Image(ширина_рисунка,высота_рисунка);

b_lite[0].src="имя_файла_светлого";
b_dark[0].src="имя_файла_темного";

function lite(what) //функцийка-мышковводилка
{
	a="button";
	a+=what;
	document.images[a].src=b_lite[what].src;
}

function dark(what) //функцийка-мышковыводилка
{
	a="button";
	a+=what;
	document.images[a].src=b_dark[what].src;
}
//-->
</script>

Вроде все понятно :-) В отличие от метода описанного в предыдущей рассылке, тут используется массив рисунков, загружаемых заранее. Это тоже неплохо - скорее всего рисунки успеют загрузиться до того, как юзер наведет на кнопоку указатель мыша.

А если ты, Петечка, такой недоверчивый, то кликни своим грызуном прямо суда.

Ну все, вы - Петечка, Дашенька, и ваша будущая семья меня уже до... утомили слегка. Хватит о смешных кнопочках, а то уши уж начинают шерстью обрастать, а ведь против этого никакой "лучше для мужчины нет" не поможет ;-).


А вот пишет тут еще Вовочка, такой забавник он, я погляжу...

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

Ответ Вовочке:

Эх, Вовочка, это просто попочка... Накрутил ты, накрутил, дружок. Вот мой тебе первый добрый совет: зачем ты развел такую грядку фреймов? Грядки в огороде разводить надо, а не на сайтышах доморощеных, так-то. Одним словом, постарайся разгрести мусор, утрясти сайт, поубивать фрейм-другой. А уж если и это не помогает... Тогда сделай-ка вот что:

Опиши в самом начале скрипта "критического" фрейма какую-нибудь переменную-флажок, и сделай её равной нулю. Потом опиши функцию, которая будет присваивать этой переменной какое-нибудь отличное от нуля значение. Не будь оригинальным - пусть присваивает ей единицу. Повесь потом эту функцию на onload тэга <body>. Тогда, когда фрейм действительно загрузится, переменная станет равной единице. Что ж, теперь все легко - надо просто перед выполнением действия, использующего что-нибудь из другого фрейма, проверять эту самую переменную-флажок, а дальше - по обстоятельствам.

Вот примерно, как это выглядит:

...всякая ботва...
<script language='javascript'>
<!--
this_frame_loaded=0;

function frame_loaded()
{
    this_frame_loaded=1;
}
//-->
</script>

<body ... onload="frame_loaded()">
...опять ботва...
</body>
...еще ботва...сколько можно?...
Если обстоятельства заставляют тебя обязательно выполнить какое-либо действие при полной загрузке другого фрейма, попробуй поиграться с setTimeout'ом. А делается это обычно так: пишется какая-нибудь функцийка, которая вешается на onload документа, к примеру. Или на onclick какой-нибудь кнопки, или на onmouseover её же, наконец. Важно, чтобы возможность корректного выполнения события этого был зависима от того, залился ли другой фрейм с сервера, или еще подвисает где-нибудь на проводах между Владивостоком и Жмеринкой. Эта функцийка вначале проверяет, установилась ли в единичку та переменная, что показывает загруженность фрема, и если нет, то ставит себя на таймаутовое выполнение и отваливает. Иначе - работает по плану.

Вот как это можно реализовать. Положим, у нас есть некая кнопка, при наведении на которую в отдельном фрейме выводится подсказка к ней. Хинт, так сказать, захотелось сделать модный %-). Петечка и Дашенька могли бы тут помочь, да вот беда: функция, которая рисует хинт, находится в другом фрейме :-( Реально бы, ессесьна, вызвать её через родительский frameset, то есть через parent'а. Так и сделаем (причем грамотно, чтобы универсально):

<a href="куда_пойдем_отсюда" 
  onMouseOver="parent.hintframe.showmazafaka('Пурум, пурум... Опилки!')" 
  onMouseOut="parent.hintframe.showmazafaka('')">
<img name="hinted_button" src="недобрый_кнопыш" border=0>
</a>

Ну и? А прикинь, Вовочка, что если к этому моменту фрейм с ненавязчивым именем hinftrame еще не нами? Что если он еще не догрузился до того места, где описана функция showmazafaka (тоже ненавязчивое имя, между прочим). Да, в этот несчастливый для всего советского народа момент браузер выдаст ошибочку с рассказом о родственниках незадачливого пользователя, рискнувшего провести по оной кнопочке, аж до седьмого колена. Причем, прикинь, все больше по женской линии:-). Не думаю, что он будет рад.

Сделаем лучше. В том же фрейме, где живет эта, принесшая уже столько хлопот, кнопочка, припишем новую функцийку (куда-нибудь в блок SCRIPT):

function transferhint(hinttext)
{
  if(parent.hintframe.frame_loaded==1) //проверить флажок загрузки
  {
    parent.hintframe.showmazafaka(hinttext); //вызвать функцию из другого фрейма
  }
  else
  {
    command="transferhint('"+hinttext+"')"; //составить команду
    setTimeout(command,500); //поставить команду на таймаут
  }
}

Чудно, теперь, если фрейм, в котором появляются хинты загружен, вызовется необходимая функция из него (не буду лишний раз повторять её имя ;-)), а если нет, то через пол-секунды (число 500 в вызове функции setTimeout есть число миллисекунд до выполнения строки command)transferhint вызовется снова. Осталось повесить на событие onmouseover кнопочки именно функцийку transferhint.

Ну, это уж я оставлю тебе сделать самому, Вовочка, тем более что на подходе еще пара ребят, не буду называть их имена, которые пишут коротко и ясно :-)

Пара ребят: Смотритель, ты - дурак!
Отвечаю: Да, действительно :-) У меня и справка есть, хехе :-) Родовая травма, знаете ли %-).

Хватит пока писем на сегодня. Рука бойца, как говорится, писать устала :-)

В подавляющем большинстве писем (хехе, а на деле в 2-х к 1-му) была высказана идея углУбить и расширить исследования в пучины CSS и DHTML. Может для кого это и секрет, а может быть и нет, но в принципе, эти две, такие непохожие аббревиатуры весьма тесно связаны. В принципе, DHTML обычно пишется при помощи CSS, однако может и без них. В то же времяя наличие CSS не обязательно предполагает, что перед нами DHTML %-) Ну что, окончательно запутал? Тем лучше :-)))

Так... обождите немного: отойду за пивом...

...Вернулся. Так вот, о чем это я? А... На деле, если вы когда-нибудь учились в институте (как, например, я) и изучали вышку (кто изучал, тот поймет), то была там пара-тройка лекций в начале курса теорвера о событиях, совместных и несовместных, полях, областях и кольцах. Чушь всякая... Но рисуночек там один был, который мне запомнился - две пересекающиеся области. Так себе как раз и можно представить DHTML и CSS. Представили? Ну, а в моей голове горит вот такая картинка:
Мое нелепое представление о месте DHTML и СSS в нашей жизни ;-)
Надеюсь, вы убедились, что дураки думают одинаково :-) В принципе, для осознавания ни того ни другого эта картинка не нужна, просто я устал жать на педали и решил передохнуть слегка в Фотошопе. Так что - не обессудьте, знатоки.

Итак, DHTML, это просто Динамический HTML, так сказать, интерактивные странички. Америкосы и другие шведы расшифровывают эту надпись как "Dynamic Hyper Text Markup Language", ну а мы, по-простецки, как вызов своему лентяю: "Девочки Хотят Тебя, Мой Лентяй" ;-) Повторяя эту магическую формлу не менее 10-ти раз в день, вы не только не научитесь писать странички, но даже и не сбросите ни грамма веса, что просто поразительно!

Понятие CSS (Каскадных листов стилей) более широко, и описывает не только мощное средство от поно...я хотел сказать "для создания интерактивных страниц", но и просто очень удобное средство для унификации, стилизации и размещения элементов страниц.

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

Вообще, насколько я помню рекомендации W3C по четвертому HTML'у, там везде рекомендуется использовать именно стили вместо старых свойств тэгов. Что ж, разумно, по-моему. Жаль, что к рекомендациям так редко прислушиваются разработчики браузеров ;-(. Но мы ребята прогрессивные, читай - стильные! Нам и клаву в руки.

Ой, только что вспомнил, как называется эта рассылка. Видать придется нам с вами рассмотреть только ту часть CSS, которая пересекается с DHTML'ом (грязного серого цвета на картинке, по крайней мере на моем мониторе ;-) ). ОК, ей и будем, значится рассматривать... но попозжа. Сейчас я устал, четыре часа ночи уж, а мне еще домашнюю страничку обновлять. Хватит сегодня себя и вас напрягать, хватит ;-)

Ну вот, сегодня мы не увидели почти ничего нового (если только самую малость ;-)), зато обрисовали небольшие перспективки на будущее. В следующем выпуске я постараюсь рассказать, как при помощи стилей слепить модный эффект какого-нибудь весьма динамичного движения какого-нибудь весьма динамичного зверька на очень Динамичном HTML'е ;-)

Лето идет, а погода все так же хороша. Пиво вроде тоже не становится хуже ;-) Что ж, жить можно, и даже, я бы заметил - нужно. Удачи!

Sincerely yours, Смотритель
Заходите как-нибудь на PYCHICKHOUSE


[ вернуться к началу ] | [оставить мнение] | [блог]

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