Сегодня, в продолжение экспериментов с HTML5 и CSS3, я решил разобраться со свойством transform. На самом деле, я уже разбирался с этим свойством на примере функции rotate. Тогда я писал о CSS, а вот изменять его с помощью JS-кода не пробовал.
Итак, я стал изучать функцию matrix. На вход ей подается аж 6 параметров! Естественно понять это обычным человеческим мозгом довольно трудно. Поэтому я решил сделать инструмент для изучения функции matrix.
На пути к созданию этого инструмента мне встретились некоторые затруднения. Например, как с помощью JavaScript менять свойство transform? Также как и при описании в CSS, в JS-движках предусмотрены специальные свойства стандартного style. Вот пример установки этих свойств: style.MozTransform = 'matrix(1, 0, 0, 1, 1em, 1em)'; // Gecko (Firefox) style.WebkitTransform = 'matrix(1, 0, 0, 1, 10, 10)'; // Webkit (Chrome, Safari) style.OTransform = 'matrix(1, 0, 0, 1, 10, 10)'; // Presto (Opera) style.transform = 'matrix(1, 0, 0, 1, 10, 10)'; // Все остальные, на всякий случай.
Но самое интересное, что если для Webkit и Gecko эту информацию можно найти, то для Presto (Opera) я обыскался. CSS описание есть, а вот для обращений из js нет примеров. Получается я первый! =)
Комментарии, вопросы, поправки и пожелания - приветствуются.
Будет странно не дать ссылки на чтение о transform: Спецификация w3c -moz-transform -webkit-transform -o-transform частично можно трансформации делать даже в ie
старенькая статейка на русском языке
UPD: Добавил в инструмент другие функции: rotate, scale, skew, translate. С ними можно поиграть, а получившееся CSS-описание скопировать куда-нибудь к себе.
Несколько наиболее интересных ссылок, о которых я писал в своём Твиттере в апреле. Это полезные статьи, сервисы и просто разные разности ))). Берём на вооружение, сохраняем в закладки, делимся с другими – не пропадать же добру! Полезный сервис для вёрстальщиков – генератор css спрайтов. Есть визуальный редактор. Удобно! Для тех, кто использует браузер Firefox наверняка [...]
Похожие статьи:
Непростое CSS меню с использованием спрайтов
Facebox IE6 png transparency fix!
Уязвимость WordPress! Пароль администратора можно сбросить!
Несколько наиболее интересных ссылок, о которых я писал в своём Твиттере в апреле. Это полезные статьи, сервисы и просто разные разности ))). Берём на вооружение, сохраняем в закладки, делимся с другими – не пропадать же добру! Полезный сервис для вёрстальщиков – генератор css спрайтов. Есть визуальный редактор. Удобно! Для тех, кто использует браузер Firefox наверняка [...]
Похожие статьи:
jQuery – статьи, уроки, книги…
Facebox IE6 png transparency fix!
Коллекции бесплатных иконок социальных сетей – зима 2010
1.Прежде всего, заведите свой аккаунт (зарегистрируйтесь) в поисковой системе Google. Это первая по популярности поисковая система в мире. Но дело даже не в этом, не в возможностях поиска, в этом Гуглу не уступают и несколько других поисковиков।
Важнее, что Google дает пользователю стройную и надежную систему инструментов по всем направлениям। И все инструменты интуитивно понятны, не требуют обучения! Google кроме всего прочего предлагает самую удобную бесплатную и даже безрекламную площадку для создания и ведения своих блогов - Blogger
2. Зарегистрируйте почтовый ящик Gmail.com! Проверено, если даже в первые дни вам будет немного непривычно, очень скоро вы поймете все удобстваработы здесь, поймете, что это действительно профессионально.Рано или поздно вам все равно придется завести основной ящик здесь, потому что многие ресурсы просто предупреждают, что они не смогут с вами работать, если ваш ящик на mail।ru или rambler.ru. Просто письма должны отправляться и также должны доходить до адресата.
3.Поставте браузер (вэб-обозреватель, программа для работы с интернет ресурсами) MozillaFirefox (красный лис). Абсолютное и подавляющее большинство , да, наверное, все начинают свою работу с обозревателем Internet Explorer, и обычно кажется, что ничего другого и быть не может. Но Mozilla работает заметно быстрее, что особо актуально для не самых продвинутых компьютеров и не самого быстрого интернета। Скачайте и посмотрите, многое вам понравится. На вашем «столе» какое-то время будет два обозревателя, это излишество потом устраните.
4.В веб-обозревателе нужно активно использовать «Закладки» (в Мозиле это самая верхняя строчка). Особенно полезно при выборе «Добавить страницу в закладки»выбрать не «Меню», а «Панель закладок»। Тогда значок очень важной для вас страницы всегда будет доступен в вашем браузере – кликнул и открыл. Очень удобно и быстро.
5. Теперь посмотрим на собственно «Рабочий стол».Воспользуйтесь гаджетами Google. Их очень много. Рабочая селекция на моем столе оставила
1.Почту (видишь анонсы писем, не заходя в саму почтовую программу
2.Twitter(можно писать прямо из гаджета, не открывая аккаунт Твиттера).
3.Блокнот ( в самом низу страницы, очень удобно держать короткие повторяемые тексты для копирования, реферальные ссылки).
4।Подписку RSS на многочисленные блоги с использованием гаджетов, которые я теперь вижу ежедневно, вижу анонсы их трех последних публикаций, - что позволяет просматривать кучу блогов (у меня порядка 30) и решать, стоит ли что-то открывать для подробного чтения। (То есть выбираете подписку с Google и выбираете вариант добавления Add to Google homepage.)Всегда в курсе событий, а времени не теряешь! Малоинтересные блоги постепенно уступают место новым (убираешь не нужный гаджет старого)।
систему инструментов по всем направлениям। И все инструменты интуитивно понятны, не требуют обучения! Google 
