Архив категории «CSS»

Динамическая вставка CSS стилей

При помощи DOM браузерах категории “А” можно делать множество простых (и некоторое количество сложных) штук довольно просто. Такие вещи как добавление или удаление элементов, вставку HTML текста, обработку событий вполне легко можно сделать кросс-браузерной. Конечно, есть небльшие различия в реализации, которые надо подгонять в каждом конкретном случае, но всё-таки в большинстве своём всё работает так, как и должно. Всё, за исключением динамического добавления стилей на страницу.

Continue reading ‘Динамическая вставка CSS стилей’

Подсказка по CSS

CSS

CSS Documentation Shortcut позволяет быстро перейти на нужную страницу в спецификации W3C CSS. Достаточно просто ввести название свойства, или хотя бы первые его символы (об остальном позаботится автодополнение).

Очень удобно!

Last.fm Гламурный и готичный

Помимо изображений исполнителей, социо-музыкальный сервис Last.fm обзавёлся также и удобным переключателем стилей (aka CSS styleswitcher). Теперь он может быть либо гламурным, либо готичным — кому как нравится.

гламурный Last.fm готичный Last.fm

Моя страница на Last.fm

Пособие по визуальным эфектам script.aculo.us (Часть 2)

В первой части пособия мы создали страничку с переключающимися табами и панелями с информацией. Всё вроде бы хорошо, но единственный недостаток этой страницы в том, что на ней загружается сразу вся информация, а отображается лишь её часть. Хорошо, что страница наша содержит всего шесть табов, да и панели не перегружены информацией, но как быть, если у нас больше табов и/или информационные панели содержат много данных? Нам на помощь приходит технология Ajax!

AJAX (Asynchronous JavaScript and XML) — подход к построению пользовательских интерфейсов веб-приложений, когда web-страница, не перезагружаясь, сама догружает нужные пользователю данные.

Continue reading ‘Пособие по визуальным эфектам script.aculo.us (Часть 2)’

Пособие по визуальным эфектам script.aculo.us

В этом пособии я постараюсь на наглядных примерах рассказать об использовании некоторых визуальных эффектов из библиотеки script.aculo.us.

В качестве примера мы сделаем альтернативную Web 2.0 версию страницы “О группе Догма” с применением script.aculo.us эффектов.

Continue reading ‘Пособие по визуальным эфектам script.aculo.us’

Image Replacement и Firefox 1.5

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

#sidebar h1 a {
    display: block;
    text-indent: -3000px;
    width: 251px; /* ширина изображения */
    height: 100px; /* высота изображения */
    background: url(../images/logo.png) left top no-repeat;            
    padding: 0;
    background-color: transparent;
    border: none;
    text-decoration: none;
}

Эта техника работала прекрасно до тех пор, пока я не установил новую версию Firefox.

Continue reading ‘Image Replacement и Firefox 1.5′