Описание тега webkit-transform

Свойства webkit-transform предоставляют несколько простых в использовании функций для наиболее распространенных операций (таких как поворот, масштабирование, наклон и перемещение) и функцию для определения общего преобразования (матрицы).
2 ответа

css @-moz-keyframes анимация не работает в Firefox 18.0.1

css @-moz-keyframes анимация в Firefox 18.0.1 не работает, Я проверил эту анимацию в предыдущей версии (забыл версию предыдущего номера), она работала, Вот анимация <html> <head> <style type="text/css"> @-webkit-keyframes animation…
2 ответа

z в translate3d

Может кто-нибудь объяснить или указать мне на пример, где "Z" в translate3d (преобразование webkit) используется? Я успешно использовал translate3d(x,y,0) чтобы получить аппаратно ускоренную 2D-анимацию в мобильном Safari, но сейчас я пытаюсь масшта…
21 сен '11 в 21:16
1 ответ

CSS Масштабирование элемента с шириной 100%

Я заинтересован в уменьшении div с шириной 100%. Проблема, с которой я столкнулся, заключается в том, что когда я масштабирую элемент, он получает фиксированную ширину и больше не расширяется на 100% ширины. Пример - http://jsfiddle.net/Fz7qh/2/ Ког…
07 июн '12 в 17:54
1 ответ

-webkit-transform: переводить блочный рендер на iPad

Итак, я понимаю, что translate / translate3d использует графический процессор, но по какой-то причине он вызывает рендеринг крупной графики в виде блоков / блоков на iPad. Я испытываю трудности с поиском где-либо, где указана максимальная ширина / в…
29 июл '12 в 08:24
2 ответа

Как повернуть линии часов на 90 градусов в CSS и поместить текст перед ним?

У меня есть следующая структура CSS, которая немного сложнее. Полный код помещен в этот JSFiddle, и я борюсь с последней мыслью, которую мне нужно реализовать там. Между горизонтальными линиями (которые находятся на одной линии с кругами) мне нужно …
24 сен '18 в 14:22
2 ответа

Как рассчитать абсолютную позицию преобразованного div

Когда вы используете transform в div абсолютное позиционирование не работает, как вы ожидали, и, похоже, его нужно вычислять вручную. Например, когда вы хотите, чтобы ваш div был в нижней части контейнера, вы делаете: div{ position:absolute; bottom:…
0 ответов

Как я могу принудительно установить абсолютную позицию в div внутри цепочки -webkit-transform?

Упрощенная форма моего оригинального вопроса. Учитывая приведенный ниже код (для Chrome/Safari), как я могу сделать так, чтобы "текст" во внутреннем div отображался вверху слева, не зная значений в матрице преобразования внешнего div? <body> &…
10 сен '13 в 20:05
2 ответа

Вернуть изображение обратно в исходное положение после поворота на 180 градусов

Я написал код ниже, чтобы перевернуть изображение. Я устанавливаю -webkit-transform=rotateY(180deg), но опять же на click Событие Я хочу вернуть изображение в исходное положение. Я старался -180 ценность, но это не работает. var status=1; function f…
03 май '13 в 09:28
1 ответ

Окружающий прямоугольник с высотой повернутых элементов и высотой в Javascript

У меня есть несколько элементов DIV (тоже могут быть изображения) с абсолютным положением, которые поворачиваются и масштабируются с помощью CSS. Как я могу вычислить общую ширину и высоту, которую занимает элемент (прямоугольник вокруг него). Прове…
26 июн '14 в 15:20
1 ответ

Мигающие черные квадраты в веб-приложении с переходами CSS

Я работаю над веб-приложением для мобильных телефонов. Приложение состоит из нескольких скользящих панелей (горизонтальных), с кликабельными элементами на каждой панели. Я использую touchstart, touchmove, touchend events для захвата сенсорных событи…
1 ответ

Почему при печати веб-страницы не будет печататься холст Google Map API V3?

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

Относительное расположение элементов HTML над преобразованным элементом изображения

Допустим, у меня есть элемент изображения, который в основном представляет собой 2D-карту, и я применил к нему следующее CSS-преобразование (используя jQuery): $('#img').parent().css("perspective","696px"); $('#img').css("transform","rotateX(59deg) …
25 сен '13 в 13:42
1 ответ

Как расширить WebKit в C/C++

Я хотел бы узнать, как расширить функциональность JavaScript, добавив некоторые плагины в браузеры на основе webkit. Любая ссылка или учебник, откуда я могу начать. Я посмотрел в http://rvr.typepad.com/wind/2011/10/webkit-extending-javascript-1.html…
08 окт '12 в 18:44
1 ответ

-webkit translate3d заикается с большими элементами

Я анимирую элементы, используя -webkit-transform: translate3d(x,y,z) и функция хронометража кубического бейзера в сочетании с сенсорными событиями для iPhone для создания пользовательского типа скролл-метода. Проблема в том, что анимация заикается (…
1 ответ

Не удалось получить значение от WebKitCSSMatrix

Мне нужно получить значения x и y для translate3d, свойства div, для которого я использую код ниже: var style = window.getComputedStyle($(videoContainer).get(0)); var matrix = new WebKitCSSMatrix(style.webkitTransform); var verticalOffset = parseInt…
07 апр '14 в 10:01
1 ответ

Одновременная CSS анимация и спиновый переход

<style> div { width:50px; height:100px; background:red; position:relative; animation:myfirst 5s infinite alternate; -webkit-animation:myfirst 5s infinite alternate; } @keyframes myfirst { 0% { left:0px; top:0px;} 25% { left:200px; top:0px;} 50…
15 мар '13 в 21:49
0 ответов

Вращение 3d Карусель

У меня есть код, который работает в последней версии Firefox (не уверен насчет IE, я подозреваю, что нет, но я не использую IE).... и только что понял, что он не работает в Chrome, мне нужно добавить префиксы поставщиков, Я доберусь до Mozzilla и т.…
24 сен '13 в 02:20
1 ответ

Позиция CSS: относительный и -webkit-transform создает глюк веса текста

Когда запускается CSS-анимация и объект позиционируется с помощью CSS, что-либо кроме static (relative, absoluteи т. д.) текст внутри объекта внезапно становится очень тонким на время анимации. Затем он возвращается к полной ширине впоследствии. Поп…
03 янв '12 в 02:11
1 ответ

CSS парил несколько раз с помощью webkit 3d transform

Когда я использую 3D-преобразование webkit при наведении, работают только верхние 50% области наведения, а нижние 50% нестабильны. В настоящее время я тестирую на Chrome (31.0.1650.63). Это ошибка? Есть ли обходной путь? Попробуйте навести курсор мы…
14 янв '14 в 15:57
2 ответа

Конфликт между -webkit transform и jQuery .animate()

Обновление: я установил скрипку, и она, кажется, работает нормально - раздел, который сначала скользит, содержит карту Google - интересно, действительно ли это проблема... Недавно я добавил флип -webkit-transform в приложение HTML5, над которым я ра…
01 апр '12 в 12:57