Вопросы по теме 'css-transforms'
Перевести x и y с разными функциями времени?
В настоящее время я использую следующий код для перевода x и y с одинаковой скоростью:
-webkit-transition:all 180ms ease-out;
Я хотел бы перевести ось X медленнее, чем Y. Можно ли указать что-то похожее на:
-webkit-transition:translateX...
5240 просмотров
schedule
28.11.2021
Ошибка преобразования Chrome CSS3 3D
У меня есть css, чтобы перевернуть карточку на элементе в трехмерном пространстве. Он отлично работает, за исключением того, что когда вы прокручиваете страницу вверх и вниз, вы случайным образом получаете белые элементы, отображаемые на странице в...
1701 просмотров
schedule
17.11.2021
Почему IE10 не отображает вложенные преобразованные элементы CSS3 3D?
Я немного заблудился, сейчас я тестирую IE10 (10.0.9200.16384), поставляемый с Windows 8 Release Preview, и мне очень тяжело. Одна из вещей, которая меня беспокоит, заключается в том, что IE, похоже, не обрабатывает вложенные 3D-преобразования...
4292 просмотров
schedule
16.10.2021
Невозможно повернуть из одной конкретной ориентации в другую
У меня есть пример вращающегося анимированного куба с использованием преобразований и переходов CSS3.
Проблема в том, что, похоже, невозможно повернуть CSS3 из начальной позиции в этот jsfiddle , чтобы показать цифру "4" (на один поворот...
676 просмотров
schedule
04.11.2021
исправлен элемент с неправильной позицией после анимации CSS
Здесь я создал jsFiddle , который копирует мою проблему.
После анимации (двойное нажатие на MOVE) фиксированный столбец возвращается в неправильном положении.
Можно ли оживить мой this без использования left или right для фиксированного...
3090 просмотров
schedule
27.11.2021
Нежелательный контур на границе при трансформации родителя
Я использую границы для некоторого контента. Однако я обнаружил нежелательный контур размером 1 пиксель того же цвета, что и цвет background , добавляемый вокруг границы при преобразовании родителя (по крайней мере, с scale и rotate ). Это также...
3116 просмотров
schedule
13.11.2021
Повернуть значок гамбургера SVG в X?
Я разработал значок с тремя полосами, используя чистый код SVG в HTML. Я использую преобразования CSS3, чтобы повернуть верхнюю и нижнюю панели в X-образную форму. Проблема в том, что они вращаются вокруг своего собственного центра, но мне нужно,...
2786 просмотров
schedule
13.11.2021
Преобразование изображения вращается без вращения
Я пытаюсь получить изображение X. Мне нужно повернуть на 180 градусов, когда он зависает, но он просто движется вверх и вправо, а не вращается.
Что я делаю не так, что это не будет выглядеть так, как будто он вращается на 180 градусов?...
680 просмотров
schedule
06.10.2021
Преобразование поворота CSS делает изображение размытым
Я создал восьмиугольный обрезанный стиль, используя CSS-преобразование, вращение и масштабирование, как показано в фрагменте кода ниже.
Однако при просмотре Chrome 52.0.2743.116 (64-разрядной версии) на El Capitan изображение выглядит размытым....
1513 просмотров
schedule
05.11.2021
Как получить относительное положение холста на холсте, преобразованном в 3D CSS?
Ради интереса я пытаюсь рисовать на трехмерных трансформированных холстах. Я написал код, и он вроде работает
const m4 = twgl.m4;
[...document.querySelectorAll('canvas')].forEach((canvas) => {
const ctx = canvas.getContext('2d');...
396 просмотров
schedule
07.11.2021
Постоянная скорость перехода CSS
Я пытаюсь добиться постоянной скорости перехода.
Заметьте, я не имею в виду разницу между «легкостью» и «линейностью». Я имею в виду, что если мы перейдем от 0 до 20 пикселей, это займет 1 секунду, но переход от 0 до 100 пикселей займет 10 секунд....
97 просмотров
schedule
09.11.2021
Направляйте элемент к центру круга при вращении (CSS / JS)
Я пытаюсь переместить 10 объектов круговыми движениями, пока они указывают на центр круга.
Я расположил элементы на круге, используя немного триггера в .js, но когда я пытаюсь повернуть их вокруг центра круга, они вращаются неправильно, с...
135 просмотров
schedule
17.09.2021
Есть ли способ изменить масштаб, не растягивая Object Fit?
Если я использую масштаб трансформации, есть ли способ сохранить изображение объекта подходящим, используя покрытие от растяжения? Вот мой код
div.category {
width: 80%;
height: 150px;
margin: 20px;
position: relative;...
231 просмотров
schedule
20.10.2021
Плавающие метки - метка над полем ввода
Я работаю над существующей формой, в которой хочу ввести плавающие метки.
Многие решения, которые я видел при переполнении стека, великолепны, но требуют, чтобы тег label располагался непосредственно под тегом <input> . Например, здесь ....
36 просмотров
schedule
21.10.2021
Как добавить фоновое изображение в div с перекошенными псевдоэлементами
Я новичок в программировании и пытаюсь получить те же результаты, что и этот https://imgur.com/a/sNOct04 В моем коде у меня есть один контейнер с двумя наклонными псевдоэлементами, чтобы придать желаемую форму. Теперь я хочу добавить фоновое...
46 просмотров
schedule
04.10.2021
Повернутые элементы в CSS, которые правильно влияют на высоту своего родителя
Допустим, у меня есть пара столбцов, некоторые из которых я хотел бы повернуть значения:
http://jsfiddle.net/MTyFP/1/
<div class="container">
<div class="statusColumn"><span>Normal</span></div>
<div...
91714 просмотров
schedule
03.03.2022
rotateY () против переходов matrix3d в Edge
Я столкнулся со странной проблемой, связанной с тем, как Edge (и IE 11) обрабатывает преобразование matrix3d. На странице, над которой я работаю, есть элементы, к которым уже применено произвольное преобразование (из-за использования плагина), однако...
424 просмотров
schedule
04.03.2022
Проблема с преобразованием JavaScript
Любопытное поведение преобразования CSS в chrome (браузер webkit) с использованием JavaScript...
var obj = document.getElementById('foooo');
// obj.style.transform == "";
obj.style.transform = "rotate(45deg)"; // works (another 2d transform)...
223 просмотров
schedule
14.03.2022
Можно ли установить другую продолжительность/задержку для параметров преобразования?
Я хочу установить несколько параметров преобразования для моего html-объекта, но с разной продолжительностью и задержкой.
Если я попытаюсь использовать что-то вроде этого:
-webkit-transition: -webkit-transform, opacity;
-webkit-transform:...
31184 просмотров
schedule
24.03.2022
-webkit-transform ломает фоновую анимацию
Пытаясь попрактиковаться в своих преобразованиях, я создал простую анимацию, которая перемещала три элемента div, используя абсолютную позицию, и также трансформировала каждый из них из позиции в позицию. Это сработало так, как и ожидалось, без...
306 просмотров
schedule
06.04.2022