Признаться, сразу и не догадался, что объявление «ПТИЧИЙ ХРЕН В БЕЛОМ НОСОРОГЕ» гласит о выступлении группы «Птичий хрен» в клубе «Белый носорог» ... ©bor.
Предыдущий абзац был должен обмануть бдительность противника, а сообщить я хотел, что наконец закончил переносить с Joomla на свою CMS очередного джумлострадальца - сайт киевской галереи современного искусства Ahouse.com.ua. Правда я сам был разочарован тем фактом, что современное искусство представлено в основном украинской живописью, однако встречаются замечательные вещи, например, «Торро» работы Николая Бутковского:
Что-то в последнее время все больше возвышенные заказы идут - галерея, хоумпага для певца, продюсерское агенство ... по закону подлости как только привыкну, опять валом попрет корпоратив и готы 0_о.
После того, как вылизана последняя строчка функционального кода проекта, начинается дизайн. Точнее, начинаются танцы с бубном - ибо этот самый дизайн он многолик и непредсказуемо изменчив, если рассматривать его через разные браузеры. Достижение кросс-браузерности - очень трудоемкая и тяжелая в плане крепости психики работа, этой теме посвящены сотни статей, написаны сотни хаков для стилевых таблиц, но из этой троицы - семейства Mozilla, Opera и Internet Explorer хоть один, да доставит несколько неприятных часов при отладке сверстанного и утвержденного макета дизйна. «И в Safari чтобы проверили ...» добавляет свои пять копеек арт-директор. Ага, щаз, только сначала застрелюсь.
Тем не менее есть способ сэкономить огромное количество впустую потраченного времени, чур не плеваться: писать код правильно! Далее - краткий итог статьи How to get Cross Browser Compatibility Every Time - 10 правил кроссбраузерной верстки:
Несколько раз натыкался на проблему с внедрением кода flash роликов с Youtube.com и других видеохостингов в CMS использующих TinyMCE. В старых версиях это невозможно даже через диалог вставки html-кода (вставленное просто исчезает после подтверждения), в новых версиях - 3 и выше есть опция вставки flash-содержимого, но приходится делать много лишних движений руками - вырезать кусок адреса, отдельно руками вписывать параметры ролика, морока. Я задумался - а изначально почему исчезает html-код?
Оказывается, TinyMCE удаляет «недружественные» теги самостоятельно и без предупреждения. Это понятно, все-таки это редактор для текста и какой-никакой разметки, а не визуальный Frontpage, поэтому все теги, не относящиеся к тексту, ссылкам и объектам внутри текста (таблицам, картинкам) безжалостно удаляются. Но это же не прописано в «ядре» скрипта, есть возможность конфигурирования?
Я покопался в образцах настроек TinyMCE и обнаружил интересную строку в скрипте инициализации, на которую раньше не обращал внимания:
tinyMCE.init({ // General options mode : "textareas", theme : "advanced", plugins : "preview,media", // Theme options theme_advanced_buttons1 : "bold,italic,underline...", theme_advanced_buttons2 : "", theme_advanced_buttons3 : "", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left", theme_advanced_statusbar_location : "bottom", theme_advanced_resizing : true, extended_valid_elements : "a[href|target|...],img[src|alt|...]" });
А вот последняя строка нас и интересует в данной ситуации - она дает скрипту список кошерных тегов, которые ни в коем случае нельзя удалять. Я модифицировал эту строку под свои нужды, добавив кусочек, перечисляющий теги используемые в flash-роликах: object[width|height|param|embed],param[name|value],embed[src|type|width|height],
Экспериментировать было некогда, время поджимало, поэтому я так намудрил со вложенностью, наверняка можно упростить, у кого есть идеи - welcome в комментарии!
Исключительно полезный горшочек сервис, позволяющий рисовать схемы онлайн - Glinkr.net. Используя его можно нарисовать... да какую угодно схему можно нарисовать, вот! А если серьезно, то пример ниже нарисован за пару минут:
Сервис позволяет рисовать текстовые блоки, снабдить их заголовками, описаниями, добавить к каждому список ссылок (дорвейщикам и спамерам - попуститься, ссылки непрямые). Также можно указать связи между блоками и раскрасить их в какой-нибудь веселенький цвет.
Навигация интуитивно понятная (это означает, что ничего лишнего, а что в интерфейсе есть - снабжено пиктограммками), фактически можно пользоваться даже если бы сайт был на китайском. Полученную карточку можно вставить на веб-страницу или отослать ссылку на результат на самом сервере, есть возможность совместной работы над схемами, при создании схемы (важно!) сразу указывается - под какой лицензией публикуется матриал.
Регистрация занимает минуту, на обучение уходит 2-3 минуты, с русским языком дружит (в списке также интерлингва, волапюк и точики), позволяет делать экспорт в .xml и обратно - импорт из него же, денег не просит говорит «мама» и писает чистым апельсиновым соком и вполне серьезно претендует на звание самого простого и удобного сервиса года!
На прошлой неделе NetTuts опубликовал подробную статью с описанием создания accordion - эффекта раздвижных дверей. Порывшись в закладках, нашлось несколько вариантов создания эффекта accordion как с помощью различных фреймворков, так и без оных.
Simple javascript Accordion - очень простой вариант вертикальных движущихся слоев. Очень маленький скрипт, 1Kb, не требует фреймворков, работает во всех современных версиях популярных браузеров.
jQuery Accordion Plugin - вертикальный accordion эффект при использовании библиотеки jQuery и плагина dimension.
jQuery Horizontal Accordion - еще один плагин для jQuery с эффектом accordion, на этот раз горизонтальный. В результате получается интерфейс, очень напоминающий XBOX 360.
MooTools Accordion - очень легкий в настройке скрипт популярного в узких кругах фреймворка. Плагинов не нужно, смотрим пример и делаем как автор. Саппорта не обещали правда, но демонстрационная версия работает неплохо.
Horizontal JavaScript Accordion - замечательный скрипт, очень легкий, не требует фреймворков, прекрасное решение для красивого одноуровневого меню.
Accordion v2.0 - скрипт-патриарх, не самый первый, но самый известный из всей серии. Работает при поддержке Prototype и Scriptaculous, позволяет делать как горизонтальные, так и вертикальные эффекты раздвигания, более того - поддерживает вложенность, очень, очень основательная вещь!
EXT Accordion Widget - еще один популярный javascript фреймворк, accordion виджет и много интересных эффектов.
Spry Accordion - десятки настроек и эффектов, продукция Adobe - что еще сказать? Сделан для легкого встраивания в код при работе с Dreamweaver, но если такового нет - то Spry можно скачать на сайте разработчика.
Оригинал записи
Знакомства - Знакомства в Москве и Петербурге. Прямо Сейчас!
Ajax