Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Итак… кнопочки.. небольшое исследование… у кого есть идеи – в комменты!!!

Есть много статей, описывающие техники стилизирования кнопок. Причём оформлять можно как ссылки, так и 2 вида кнопок: input type=»image» и button. Я предпочитаю использовать последнюю.

Многие пишут об удобности этого тега и пророчат великое будущее…

Трудно подобрать себе универсальную технику. В каждой есть свои минусы. Но будем стремиться к идеалу – меньше картинок, меньше лишних пустых тегов в коде!

А.. ещё… по поводу hover – видимо не везде можно избежать использования javascript :( и зум… тоже сильно не поиграешься, так увеличение на 1-2 размера шрифта ещё прокатит, а дальше болт :(

Ознакомлю с видами оформления:

1) «sliding doors» – развижные двери двумя картинками + span.

Хотелось бы отметить сложность использования в Опере (в ИЕ6-7 тоже, но можно пофиксить с помощью CSS) – при клике на кнопке её контент сдвигается и кнопка кажется «поломанной» :(

2) Двери, только одной картинкой + span. Идея ничего так, вот только снова для ссылок и input сделали. Про button забыли :(

Не проблема – подшаманим сами! Или проблема? Фак! :)

Меняем немного код и всё работает вроде :)

Под ИЕ пофиксили нажатие кнопки, а Опера всё ещё глючит. Делаем вывод, что картинки нужно убирать с button и применять ниже, например добавив ещё один span. Этот метод последнее время и использую…

Продолжение следует!

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Thickbox – простой в использовании, универсальный, с широкими возможностями плагин для jQuery из семейства «lightbox». С его помощью можно сделать почти всё :) Кроме callback’а по закрытии окна. Пусть с минимальными возможностями… нету и всё! А иногда так необходимо обновить родительское окно по закрытии popup.

В четвёртый раз перерывая официальный форум нашёл-таки полезный совет. Даже целую статью о модификациях thickbox’а, в которой описаны открытие вторичных окон, вызов окна без добавления к ссылке класса, вызов по закрытию попапа любой родительскогй функции…. Вкуснотища!!!

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Вёрстка сайтов не такое уж и сложное дело… если бы не одно НО, которое называется Internet Explorer :)

Проверять как выглядит сайт под разными версиями этого «браузера» довольно сложно. Кто пользуется веб-сервисами, кто standalone версиями, а кто и просто бегает к соседу с просьбой «а ну-ка открой свой седьмой»…знакомо?

С лёгкой подачи WebWorkerDaily представляю вам IETester – бесплатная утилита, которая облегчит нам жизнь. С помощью этого браузера вы сможете просматривать сайт в IE5.5, IE6, IE7 и IE8 beta1 !!!

UPD:

Программа хороша! но ещё немного сыроватая, о чем ниже…

В процессе тестов оказалось ей нужен 7-й IE для рендеринга страницы во всех заявленных версиях. На свой страх и риск таки поставил его (хотя до этого использовал IE6+PortableIE7). Даже рад этому – всё-таки седьмая версия сейчас «основная».

Пока что полёт нормальный, но случайным образом вылетает браузер – и самое интересное не понятно как лечить :). Практикую «вылетело-запустил заново» – и так до победы. Обычно хватает пару раз. Закономерности не заметил, но на оф.форуме пишут, что крашится при открытии IE6 в первой закладке… В принципе я доволен, а надежда на новые неглючные версии добавляет оптимизма :)

UPD2: Танцы с бубном показали, что открытие закладок в порядке убывания версий (8,7,6,5) добавляет стабильности :)

Во время недавней вёрстки интернет-магазина (а вы сами понимаете они не просты) особых нареканий не было, браузеры работали гладко. Жаль только отсутствует меню «открыть» – адрес подопытной странички приходится вставлять из буфера.

Из новенького – работают «conditional comments» для IE (хотя некоторые сомневались).

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Довелось работать с симфонией… мутная вещь, однако!

Есть такая нехорошая в ней фишка, как использование папки «web» для приложения :(. На «денвере» запарился с виртуальными хостами, но всё поднял кое как…

Другая проблема появилась, когда я захотел выложить проект – на хостинге ведь «public_html» папка у апача! Хорошо, если это ваш личный сервер и можно подправить конфиг апача или через админпанель что-то поколдовать (кстати так и не нашёл как это сделать в direcadmin). А что если нет доступа?

Решение было найдено на блоге Digital Base и заключается в добавлении кода в конец конфигурационного файла вашего приложения (config.php):

1
2
3
4
5
6

      $sf_root_dir = sfConfig::get('sf_root_dir');
      sfConfig::add(array(
        'sf_web_dir_name' => $sf_web_dir_name = 'public_html',
        'sf_web_dir'      => $sf_root_dir.DIRECTORY_SEPARATOR.$sf_web_dir_name,
        'sf_upload_dir'   => $sf_root_dir.DIRECTORY_SEPARATOR.$sf_web_dir_name.DIRECTORY_SEPARATOR.sfConfig::get('sf_upload_dir_name'),
      ));

Естественно остальные папки фреймворка должны лежать вне папки «public_html» !

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Появился интересный плагин для jQuery – Facebox. Он является аналогом лайтбокса, тоже позволяет выводить картинки… но кроме них ещё и div’ы и даже отдельные странички!!! Берём на вооружение :)

ЗЫЖ прямо старые добрые модальные окна…

ЗЫЖЖ люди, чтобы в jQuery не было глюков, юзайте «DOCTYPE XHTML 1.0 Strict», а то попалась в руки готовая вёрстка с «Transitional» и пришлось полдня разбирался почему в ИЕ глючит анимация :((((

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Пришлось по работе разбираться с SVN. А так как я ничего не знаю о Subversion и использовании TortoiseSVN, то отправился гуглить. Наткнулся на полезную статью «Версии под контролем«, которую написал Лобач Олег.

Разработка программного обеспечения без применения различных инструментов потребовала бы колоссальных затрат сил и времени. Одним из таких инструментов являются системы контроля версий, примером которых может служить Subversion – тема данной статьи.

Автору респект и уважуха, а статью в закладки, однозначно! Собственно как и остальные заметки по теме от автора блога: «Как и Зачем делать ветки?«, «Как слить изменения между ветками. Часть 1«, «Как слить изменения между ветками. Часть 2«.

Возможно полезной для кого-то (я юзаю SciTe) будет статья «Совместное использование Notepad ++ и TortoiseSVN«.

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Вы наверное не раз замечали, что при использовании тега PRE или CODE для отображения какого-то куска кода получается весьма некрасивая картина. А именно: строки отображаюся без переносов, растягивая и портя дизайн сайта. До того как я написал прошлую заметку я особо не заморачивался данной проблемой. Сегодня же пришлось погуглить и найти красивое CSS решение проблемы:

1
2
3
4
5
6
7

pre {
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
}

Ориганал опубликован на Optimizator Field - блог веб разработчика. Пожалуйста, оставляйте свои комментарии там.

Для пользователей WordPress есть замечательный плагин Audio Player (там же рассказано о его разукрашивании). А что же делать если понадобилось вставить плеер на обычном сайте?

Read the rest of this entry »

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Вот и настало время выплеснуть из себя заметку по CSS :)

Что-то из инструментария хочется описать. Упрощаем и делаем свою работу удобнее! Зачем? И ребёнку ясно – возможность в рабочее время иметь законные минутки, чтобы написать в блог или порубиться в КС с коворкерами :)

Сегодня я расскажу о КСС-дэбаге и диагностике :)

Read the rest of this entry »