 | ||||||||||||||||
|
Доброго времени суток, дамы и господа. Нравится мне этот Доренко, такой оптимстичный, веселый такой ;-) Ему бы книжки детские писать, а он... Эх, зарывает человек ведь талант, зарывает... И хватит о нем ;-) Нравится мне это или нет, но пришла пора извиняться. Мне, естественно, ибо это выпуск ждал своего часа чуть ли не целый месяц ;-( Да, стыдно, товарищ смотритель, стыдно... Но что делать, сессия, обрыв связи, неурожай риса в Китае и еще много подобных "маленьких неприятностей", как говорит одна девочка в рекламе, отрывали мои непоседливые ручки от клавиатуры. Но все, конец всем бедам, сессию я сдал, связь восстановилась, а "маленькие неприятности" у вышеупомянутой девочки перешли в разряд "больших" ;-) Так что больше ничто не стоит между мной и вами, дорогие подписчики. Я только что вернулся с фазенды Дона Паппы, где занимался окучиванием бататов, и теперь душа жаждет интеллектуального труда. Вперед - к победам программизма! Кстати, о вас, мои читатели (тьфу, чуть не написал - почитатели ;-)) - я был поражен, но нас, больных, уже почти 300. Не так уж и плохо для рассылки, которая, собственно, еще и не выходила ;-) Будем продолжать в том же духе. Напоследок, кратенько о сегодняшнем выпуске. Он будет построен по схеме школьного сочинения: вступление, ответы на письма, немного по теме, заключение. Вступление вы только что прочли.
Итак, сегодня нам пишут Машенька и Дашенька, и вот по каким вопросам:
Машенька: "Как сделать,чтобы при прокрутке страницы фон оставался на одном
месте, а текст с картинками двигался?"
Дашенька: "Что нужно сделать, чтобы при наведении курсора на картинку-ссылку появилась другая, т.е. эффект светящейся или нажатой кнопки?" Что ж, попробуем ответить. Ответ Машеньке: Да, такая тема есть. Правда, насколько я знаю, она работает только для IE 4.0 и выше. NC её пока не поддерживает (во всяком случае ниже версии 4.6). Так что, если ты хочешь писать переносимый HTML, то три раза подумай, прежде чем использовать такую экзотическую штуку. Но... дело твое ;-) Итак, коротко и ясно, сразу синтаксис: <body background="тра_ля_ля" ... bgproperties=fixed>Тут все вроде бы понятно: "тра_ля_ля" - это имя картинки на фон, многоточие - остальные свойства body, и самое важное - там, в конце. в связи с таким вопросом, хотелось бы затронуть и стили. Чтобы писать стильные страницы, Машенька, надо уметь пользоваться стилями. Кстати, раз уж поднялся такой вопрос, стоит обсудить еще пару-тройку стилей тэга body. Этим и займемся ;-) Кто был на домашней страничке Смотрителя, тот наверное видел что-то вроде ободранного краешка папируса, идущие по левому краю странички. А может кто-то увидел там и вовсе обкусанные листочки обоев - тут все ограничивается воображением ;-) Эти самые краешки и были сделаны при помощи стилей привязки и повторения. Вот их неполный список (полный знают БГ и еще пара-тройка умных ребят:-)) Итак... background-attachment Хехе, сюрприз! Имеет три значения, два из которых полезны. Вот они: scroll и fixed. Одним словом, используя этот стиль, зафиксировать фоновое изображение Машенька могла бы и так: <body ... style="background-attachment:fixed">Очевидно, что scroll - это значение стиля по умолчанию, иначе бы у людей возникал вопрос "а как заставить его вертеться?" background-repeat Вот его-то Смотритель и использовал в своем "папирусе". Данный стиль управляет повторением фонового изображения на страничке. Имеет четыре значения:
background-position Тоже бодрый стиль. Управляет положением фоновой картинки на страничке. Используется стандартный синтаксис с использованием значений [X% Y%], [X Y], либо [left|center|bottom top|center|bottom] (надеюсь, я выражаюсь понятно? для непонятливых - пример подальше :-)) Вот как прижать, к примеру, фоновое изображение к правому краю: <body ... style="background-position:right top;"В связи с этим возникает маленький ньюанс... Во первых, не стоит использовать данные выкладки на NC4.x, а во вторых, IE4.x размножает фоновые картинки только вниз-вправо, но никак не вверх-влево. Так что, Машенька, опасайся прорех в фоне ;-))) Ну, Машенька, хватит тебе на сегодня, утомила ;-) Ответ Дашеньке: Это так просто, что существует очень много методов. Хотя, если посмотреть правде в глаза, все они, в конечном итоге, делают одно - подменяют свойство src тэга img. Я опищу ту методу, которую использовал в своей последней работе. Делается все так: сначала рисуются две картинки, желательно одинакового размера ;-) Называются они примерно так: "tralala1_1.gif" и "tralala1_2.gif", или там какое еще расширение :-) (кстати, похоже: тра-ля-ля - сегодня слово выпуска просто ;-) ) Считаем, что первая картинка - это которая погашена, а вторая типа как светится, и также что они находятся в том же каталоге, что и HTML, их использующий. Дальше где-то, где ты, Дашенька, собиралась разместить эту красивую кнопочку, мы напишем: <img src="tralala1_1.gif" name="tralala1" onmouseover="lite(1)" onmouseout="dark(1)">Итак, что здесь что... src явно указывает на "темную" картинку, name я выбрал сам, это будет имя объекта для JavaScript'а Дашенькиного HTML'а. Функция lite будет зажигать кнопочку по наведению мышки, а функция dark - гасить ее. Почему я их так назвал? Люблю английский язык, знаете ли ;-) Теперь надо написать сами функции зажигания и гашения кнопочки. Ладно, я использую для этого JavaScript, ибо язык достатчно простой и мне нравится. Итак, где-нибудь в HEAD-области страницы напишем вот такую кучу текста:
<script language="JavaScript">
<!--
//функция зажигания кнопки
function lite(whom)
{
a="tralala";
a+=whom;
document.all(a).src=a+"_2.gif";
}
//функция гащения кнопки
function dark(whom)
{
a="tralala";
a+=whom;
document.all(a).src=a+"_1.gif";
}
//-->
</script>
Замечательно, теперь разберем, как это работает... Функции похожи, потому разберу только первую из них. Вначале некой переменной а присваивается некое слово tralala, случайным образом совпавшее с началом названия файлов-картинок и с именем кнопки внутри HTML'а. Потом к нему прибавляется параметр, переданный в функцию, а на самом деле - это просто какое-либо число, являющееся окончанием начала ;-) имени файла-картинки, плюс окончанием имени кнопки. И все. Конструкция document.all("что_то") возвращает объект с именем "что_то", а так как мы (и Дашенька) уже знаем, что это объект img, имеющий свойство src, то мы этому свойству присваиваем имя файла с соответствующей картинкой. Круто! Жаль, всегда надо помнить о том, что название кнопок внутри HTML'а должно совпадать с началом названия файлов-картинок. Зато очень просто использовать одну и ту же маленькую элегантную функцию для многих кнопок, экономя место в тексте. Я не спорю, может найдутся способы и получше, это не вершина, конечно же. Если кто знает - шлите Смотрителю Все, Дашенька, ты тоже утомила меня ;-)))
А по теме сегодня действительно будет немного. Утомленный Машенькой и Дашенькой, я решил спросить вашего, подписчики совета. Куда бы нам направить стопы своих исследований? Тут есть несколько перспективных, на мой взгляд, направлений. Во-первых, это CSS - каскадные листы стилей. Мощнейший инструмент по созданию динамического HTML, тем не менее не менее опасный для переносимых страниц. Во вторых - это layers - слои, тоже, видимо, интересная тема для пары-тройки выпусков. И, в третьих, глобальное - Server-Side-Scripting, три зловещих "S", которые рассматривать и рассматривать. Итак - каковы приоритеты интересности для вас, подписчики? Пишите мне. Кстати, тут недавно у меня произошел спор с одним веб-мастером, девушкой, кстати, по поводу того, какой же все же браузер лучше, NC или IE. Я понимаю, конечно, что спор вечен, но все же мне было бы интересно узнать и мнение "независимой аудитории". IE, к слову, нам навязывается, чем и можно объяснить его превалирование на рынке. А вот объективного мнения об обоих гигантах браузинга я так и не слышал. Кроме как от себя, ессесьна ;-)))). И последнее. Опять же появился интересный вопрос. Фреймы - за и против. Не секрет, что можно сделать сайт и без фреймов, несмотря на расхожее мнение, что навигация осуществляется непременно в их контексте. Опять же хотелось бы узнать мнение аудитории, что сейчас предпочтительнее - страницы "листовой" компоновки, без, или с минимумом (не больше 2-х) фреймов, либо жестко увязанные многофреймовые сайты.
Лето - это хорошо. Хорошо, когда тепло, хорошо ночью и с запасом пива ;-) Вообще, жизнь улучшается, чего и вам желаю :-))) Sincerely yours, Смотритель |
| ||||||||||||||
| ||||||||||||||||
