ArtShok. Сайтостроение и немного SEO

Уроки и примеры по CSS, jQuery. Советы по монетизации и продвижению сайтов


jQuery пример: красивая смена текста за 10 минут

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

Ничего сложного в данном уроке нет и займет он в среднем минут 10 (при чем у меня большая часть времени ушла на подготовку фона для примера - пришлось выверять с картой где какие города находят). Чтобы понять о чем речь - смотрим пример.

Демо | Скачать
3 шага для анимации текста »

04.08

2009

jQuery пример по замене фоновой картинки для отсутствующего изображения

Отсутствующие изображения на вашем сайте могут показать вас или то, что вы предлагаете не с лучшей стороны. Со временем изображения по тем или иным причинам могут быть удалены без вашего ведома. В этом случае браузеры предлагают посетителю альтернативный контент. К несчастью у каждого браузера своё видение того, как этот контент представить и не всегда это выглядит лучшим образом.

jQuery пример, фоновая картинка для отсутствующего изображения

В качестве альтернативного решения можно использовать jQuery и специально подготовленное изображение, которое будет отображаться вместо отсутствующих картинок.

jQuery пример, фоновая картинка для отсутствующего изображения

Создайте изображение, подключите фреймворк и добавьте следующий код:

$(document).ready(function() {
$('img').error(function() {
$(this).attr({
src: 'missing.png',
style:'border:3px solid #999;width:144px;height:144px;'
});
});
});

Автор статьи - Alex Ilin

10.22

2008

Меню на CSS+jQuery (гаражные двери)

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

Если же вы все-таки хотите привлечь внимание и удивить своих посетителей, например, если тематика вашего сайта - запчасти Инфинити здесь уже можно реализовать меню в виде “гаражных дверей” (единственный момент - вам потребуется более интересная отрисовка, чем в примере)

Меню на css и jQuery

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

Как создать красивое меню на jQuery и CSS

09.25

2008

Украшаем формы с помощью CSS и jQuery - часть 1

Сегодня урок будет коротким, но полезным:) Почему полезным? Ну хотя бы потому, что мало кто уделяет достаточно внимания оформлению форм. И, кстати, зря.

Все большое состоит из маленького, и, дорабатывая именно это маленькое, мы в итоге получаем “конфетку”. Так что рекомендую не брезговать оформление чекбоксов, полей, выпадающих списков и прочих элементов. Времени потратите не много, а результат будет ощутимым.

Как изменить дизайн форм, используя css и jQuery

09.08

2008

PNG-24, проблема отображения в IE. Как исправить?

До тех пор, пока IE 6 версии и ниже не уйдет из обихода пользователей, нам предстоит решать проблему отображения png-24 в браузере. Это актуально хотя бы потому, что, согласно статистике, больше 50% посетителей используют до сих пор эксплорер, в связи с чем не принимать их во внимание будет глупо и непредусмотрительно. Как минимум это приведет к потере посетителей, не сумевших оценить ваш дизайн и использование в нем png.

Решение проблемы png24