Занимательные поделки от Джонатана Снука. Данная статья будет интересна скорее новичкам, нежели более умудренным разработчикам, хотя мистер Снук достаточно авторитетен и его методики могут быть полезны всем.

С рассветом WEB 2.0 получили развитие и javascript фрэймворки, позволяющие вебмастеру делать динамические элементы сайта гораздо быстрее и проще. Одним из таких фреймворков является jQuery, получивший огромную популярность за свою простоту и невероятно малый вес. Итак, представляю вашему вниманию 10 наиболее полезных скриптов jQuery для улучшения интерфейса вашего сайта.

Общая информация

Так как мобильных устройств существует великое множество, то одна модель может поддерживать какие-либо возможности HTML/CSS, а другая наоборот — либо не поддерживать, либо поддерживать неправильно.

Но большинство устройств среднего и уж тем более hi-end класса поддерживают HTML/CSS в той или иной степени. Таким образом, язык WML для разработки сайтов под мобильные устройства устарел и практически не используется. На смену ему постепенно приходит общепризнанный стандарт в разработке сайтов — XHTML/CSS. Кодировка — строго UTF-8 (No BOM).

Предлагаю вашему вниманию шпаргалку по микроформатам собственного перевода.
Шпаргалку делал конкретно для себя, без подробного описания, но думаю по примерам должно быть понятно.
Рекомендую смотреть не в обычном блокноте, а в notepad++
В дополнение, включил пустой css с классами. Сам этим css не пользуюсь, но может кому-нибудь пригодиться.
Включает в себя:

• rel, rev
• XFN
• hCard
• hReview
• xFolk
• hAtom
• hCalendar
• hResume
• hAudio

Скачать можно по этой ссылке www.site-creator.info/projects/mf.rar
P.S. Если кто найдет неточность, ошибку или переведет то что еще не переведено — буду только рад.
Материалы для этого, искать тут microformats.org

Создать свой класс в MooTools очень просто:

//Example 1
var someClass=new Class({

   initialize: function(){
      alert('Hello, world!');
   }

});* This source code was highlighted with Source Code Highlighter.

Обычно пользователю нет дела до того, какие подходы мы применяем при разработке, как настроен сервер, какие клиентские и серверные фреймвёрки мы используем. Его может волновать на сколько сайт полезный, удобный и быстрый. Наша же задача заключается в том, чтобы не доставлять пользователю неудобства, радовать его, и тем самым заставлять его покупать наш мега-продукт или смотреть на наши замечательные баннеры. Эта статья о том, как создавать быстрые сайты.

Ощущение динамики часто являлось тем, что отличало насыщенные Flash-ем сайты от сайтов, основанных на стандартах html. До недавнего времени флэш-интерфейсы всегда казались более живыми, они взаимодействовали с пользователем динамично, и это тот функционал, который остальные сайты не могли просто взять и скопировать.

Конечно, позже состояние дел изменилось — появились эффекты для динамических интерфейсов, поддерживаемые такими JS-библиотеками, как Prototype, Scriptaculous, Moo, YUI, MochiKit (и этот список можно продолжить). Сейчас самое время (через 4 года) вспомнить технику CSS Sprites и посмотреть, сможем ли мы добавить в неё «немного динамики».

Доброго времени суток.
Это мой первый серьезный пост на Хабре, так что критика приветствуется.
Сегодня я расскажу о написании плагина для JavaScript-библиотеки MooTools на примере модального всплывающего окна.

Как-то я видел забавный дизайн с обезьяной, позади которой очень занимательный фон который динамически менялся при изменении размера окна брузера.

Это достигалось за счет движения нескольких параллельных слоев.

Недавно на хабре был топик, в котром было рассказано об облаке на флеше. Посмотрел, понравилось, решил повторить на javascript-e. Вот что получилось: demo зеркало архив.
Создание облака происходит так:

var cloud = new Cloud(
   {
        radius:200,
      parent:document.body
   });
   cloud.addTag([
      
      {href:"#",w:"2",text:"нло"},
      {href:"#",w:"2",text:"общение"},
      {href:"#",w:"1",text:"по"},
      {href:"#",w:"1",text:"подкаст"}
   ]
   );

Не знаю, пригодится ли, при большом количестве тагов жутко тормозит.
Тестировал в Mozilla 3, IE7.

P.S. Если понравится, можно будет его еще как-то улучшить, но пока смысла не вижу :)

Вот хабра юзер Kron0S сделал плагин для wordpress на основе моего скрипта.

Судя по комментариям сильно тормозит, я провел не большую оптимизацию при тегах в количестве 100 штук на моей машине(ntel Core 2 Duo 2.3 с 2Gb Vista FF3) почти не тормозит жду ваших комментариев. Может кто предложит еще както оптимизировать код ( Фраемворки не предлагать только алгоритмы).

Вступление

Те, кто когда-то только-только начинали изучать CSS, особенно имея небольшой опыт программирования десктопных приложений на Delphi или VB, наверняка хотели иметь возможность использовать конструкции вроде left:30%+10;
Потом все мы научились использовать margin, вложенные и плавающие блоки. Тем, кто всё-таки не прочь побаловаться, посвящается: JSCSS

Основное отличие от оригинала в том, что Lightwindow позволяет просматривать не толко картинки, но и практически все что угодно:

• Media: Movies, Flash (с «подгонкой» под размер окна), PDF..
• Веб страниц (включая, по внешней ссылке)
• Формы
• … любой веб-контент

В этом топике я постараюсь обобщить материал про сжатие данных. Сжиматься будет css, js, html.

При подгонке сайтов до единого вида во всех браузерах, верстальщик использует не один css хак.
Но зачем обычному пользователю с IE получать избыток кода для других браузеров firefox, opera, safari?!
Это проблема легко решается с помощью динамического css.

Прочитав недавно на пьяную голову «Обработка ошибок и исключений в PHP», решил применить полученные знания на практике. Честно, ещё 6 часов назад не знал, куда это меня приведёт, но в итоге теперь мои скрипты при ошибка зажигают вот такой симпотный экран:

Привет. Сегодня я хочу вам рассказать о том, как можно изменить внешний вид файлового инпута.

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

Пару дней назад наткнулся на статью про 38 способов скругления блоков. Очень понравилось. Однако там я не встретил способа, которым пользуюсь уже около года. Он не требует лишних тэгов и требует загрузки только одной картинки (спрайт). Работает во всех современных баузерах и IE6+

Моя статья на Временно.нет

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

Здесь представлен обзор 38 статей, разбитых на 4 категории по способам реализации.

Довольно часто некоторые заказчики, отдавая макет сайта на вёрстку, требуют попиксельно достоверной точности в разметке во всех браузерах.

Проверить такое соответствие достаточно легко — нужно сделать скриншот сайта и совместить его с графическим макетом, например, в Photoshop'е.

Но вот только в процессе вёрстки использовать такой приём не очень удобно.

Как сказал Robots: « а если без шуток, …, дилетантам лучше читать и учиться, а создание топиков оставить профессионалам.»

В ходе многих статей, которые в последствии назывались «непрофессиональными», расставляю для будущих писателей все точки над… Дабы больше не возникало нареканий в вашу сторону.

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

В этой статье я объединил (скомпилировал) уже изложенные мысли (!) многих людей, но почему-то так и не донесенные до большинства. (www.flack.ru, www.pepelsbey.net и некоторые другие)