Сен

28

Делаем профессиональные таблицы с помощью CSS

By masster

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

CSS Table Tutorial from TheWebSqueeze on Vimeo.

Это html файл:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title> CSS Tables >> A Screencast by Jack Franklin
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>
Name Age Shoe Size
Bob 15 11
Jack 10 9
Bobette 17 3
Jim 12 6
Jacob 97 4
Karinne 12 5
Linda 20 8
Simon 11 12
</body> </html> </pre> А это CSS файл
table {
    border-collapse: collapse;
    width: 500px;
    font-family: 'Trebuchet MS';
}

tbody tr:nth-child(odd) {
    background-color: grey;
}

tbody tr:hover {
    background-color: #E3E3E3;
}

tr {
    height: 50px;
}

td, th {
    text-align: center;
    border: 3px solid #ccc;
}

thead tr {
    background-color: #111;
    color: white;
}

Источник: http://www.thewebsqueeze.com

Мар

27

Лучшие календари на jQuery

By masster

jQuery UI Library DatePicker

Элемент DatePicker из известной библиотеки интерфейсных элементов jQuery UI. Множество полезных функций, а главное - локализация для многих языков!

jMonthCalendar

jMonthCalendar полный календарь на месяц, который поддерживает управление через события, что очень важно для разработчиков.
Вы просто инициализируете этот календарь с определенными параметрами и с массивом событий, все остальное плагин делает сам!
Плагин позволяет разработчику отслеживать такие события, как click, когда пользователь только собирается изменить месяц, а также событие после завершения
смены месяца. Поддерживает события перемещения мыши на объектами календаря и т.д.

jQuery date picker plug-in

Это абсолютно надежный плагин позволяет очень просто добавить ввод даты на вашем сайте.

Read more »

Мар

26

Фотогалерея на jQuery - просто великолепно!

By masster

Этот сайт (http://www.lisapram.com/) испанской художницы Lisa Pram поразил меня не только отточенным дизайном, безукоризненной версткой, но и великолепной a la Flash функциональностью. И все это - благодаря jQuery.

http://www.lisapram.com/

http://www.lisapram.com/

Кто еще сомневается, стоит использовать для разработки RIA (Rich Internet Applications) jQuery, после просмотра этого сайта, думаю, все же примет решение именно в пользу jQuery. Удивительно гармонично реализована метафора баркода, который плавно раскрывает изображения из фотогалереи. Интересно сделаны фильтры, отбирающие изображения из категорий: Professional, Experimental , Advertising и Editorial и формирующие на лету динамический баркод. Короче, неслаждайтесь, изучайте исходник, этот сайт - лучшая иллюстрация возможностей jQuery!

Янв

24

Иконки - карандаши на любой вкус

By masster

Скачать:

Deposit

Дек

21

Крутится-вертится или как создать индикатор загрузки для Ajax

By masster

Если вы пишете приложения, использующие Ajax, то я думаю, вы наверняка сталкивались с проблемой создания оригинального “спиннера” или индикатора процесса. Чтобы было понятно, о чем речь, приведу как образец вот этот:

ajax-loader

ajax-loader

1. http://www.ajaxload.info/ - здесь находится довольной мощный генератор индикаторов - можно выбирать цвет фона и цвет самого индикатора. На выбор - большой выбор картинок - на любой вкус!

Приведенный выше индикатор как раз был получен с помощью этого онлайн генератора.

2. http://loadinfo.net/ - это другой подход к идее генерации индикаторов. Здесь перед вами сразу открывается панорама всех возможных образцов:

Щелкнув по любому из них, можно настроить цвет фона и цвет самого индикатора.

Все работает - проверено!

Дек

14

CSS генераторы

By masster

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

1. Генератор формирования блоков со скругленными углами (http://www.neuroticweb.com)


2. Генератор форм (http://www.jotform.com)

3. Гнератор CSS шаблона для веб-страницы (http://csscreator.com/?q=tools/layout)