Записи в разделе: Opera



SVG: Особенности оформления фигур с помощью CSS

2012.05.02

Сегодня я столкнулся с весьма интересными особенностями работы браузеров при отображении SVG-фигур оформленных через CSS. Для начала возьмем и создадим тестовый SVG-объект: <rect id=”testRect” x=”100″ y=”100″ width=”300″ height=”100″/> Первая часть эксперимента Через инлайн стили зададим ему офромление. Для этого добавим … подробнее →

Опубликовано в: Chrome, CSS, Firefox, Opera, SVG, Все записи | Помечено , | Оставить комментарий

Автомобили ручной работы в SVG

2012.04.27

Пару дней назад я нашел брошенный в клипарт SVG-автомобиль. Владелец транспортного средства не известен. В процессе изучения технического состояния находки обнаружились проблемы с избыточным весом и множество лишних деталей. После оптимизации кривых и сокращения количества элементов оказалось, что авто довольно … подробнее →

Опубликовано в: Chrome, Firefox, Opera, Presto, SVG, WebKit, Браузеры, Все записи | Оставить комментарий

SVG: Кто и как поддерживает анимацию через spline?

2012.04.25

Оказывается в SVG можно делать не только равномерные анимации, но и анимации с переменной скоростью. Для этого нужно добавить к элементу анимации свойство calcMode, которое по умолчанию выставлено в paced (равномерная анимация). В данном случае меня интересует значение spline, которое … подробнее →

Опубликовано в: Chrome, Firefox, Opera, SVG, WebKit, Браузеры, Все записи | Помечено , , , | Оставить комментарий

SVG: Использование подключенных ресурсов

2012.04.24

Сегодня я столкнулся с еще одним странным поведением браузеров при интерпретации SVG. Допустим, нужно подключить SVG-изображение которое находится во внешнем файле. В секцию defs помещаю элемент image: <image id=”rect” xlink:href=”rect.svg” width=”100″ height=”50″/> После этого использую его пару раз: <use xlink:href=”#rect” … подробнее →

Опубликовано в: Opera, SVG, Браузеры, Все записи | Помечено , | 1 Комментарий

SVG: Такой странный animateMotion

2012.04.23

Прошлым летом я уже писал про SVG-элемент animateMotion и приводил пример его работы. Вчера он преподнес мне неожиданный сюрприз. Оказывается браузеры разделились в интерпретации параметра transform анимируемого объекта. В Firefox и Chrome\Chromium трансформации применяются только к объекту и его визуально … подробнее →

Опубликовано в: Chrome, Firefox, Opera, Presto, SVG, WebKit, Браузеры, Все записи | Помечено , | Оставить комментарий

SVG: Кто чего поддерживает?

2012.04.22

В последнее время я обнаруживаю все больше деталей из спецификации SVG, которые тот или иной браузер не поддерживает. Например, Chrome не ловит мышейсобытия начала и конца анимации. Для быстрой проверки кто неправ — я или браузер удобно использовать специальные таблицы. … подробнее →

Опубликовано в: Chrome, Firefox, Opera, Presto, SVG, WebKit, Браузеры, Все записи | 2 Комментариев

SVG: Анимация и её события

2012.04.21

Некоторое время назад я уже писал про разные виды анимации в SVG и их использование. Пришло время разобраться с теми событиями которые генерирует любой анимационный элемент. Всего в стандарте SVG описано три события: beginEvent (срабатывает в момент начала анимации), endEvent … подробнее →

Опубликовано в: Firefox, Opera, Браузеры, Все записи | Помечено , , | Оставить комментарий

А вы используете insertAdjacentHTML?

2011.08.21

19 августа вместе с релизом Aurora 8 я обратил внимание на метод работы с DOM-деревом insertAdjacentHTML. Оказывается, он поддерживается уже во всех современных браузерах: Chromium\Safari, Opera и даже Internet Explorer. И вот в 8-ой версии Firefox появится поддержка этого метода. … подробнее →

Опубликовано в: Chrome, Firefox, Internet Explorer, JavaScript, Opera, Все записи | Помечено | Оставить комментарий

HTML5: Готовимся использовать элемент progress

2011.07.09

Еще чуть-чуть и в список используемых элементов разметки можно будет включить элемент <progress>. Эта мысль пришла мне в голову когда я прочитал заметку одного французского разработчика. На данный момент элемент нормально отображается в Google Chrome и Opera. Для Firefox будет … подробнее →

Опубликовано в: Chrome, CSS, Firefox, HTML5, Opera, WebKit, Браузеры, Все записи | Помечено , , | Оставить комментарий

CSS: Границы элементов

2011.06.25

На этот раз я решил сделать себе шпаргалку по разделу касающемуся границ элементов в спецификации CSS3. border Первая часть — цвет границы (border-color). Его можно задавать как по отдельности: верх-право-низ-лево (border-*-color), так и одним свойством. В общем все по стандартному … подробнее →

Опубликовано в: Chrome, CSS, CSS3, Firefox, Opera, Все записи | Помечено , | Оставить комментарий