вопрос с css3 transform3d в угловом

У меня есть ползунок, доступный здесь: Слайдер с переходами

И я попытался интегрировать его в свое угловое приложение.

Интеграция была выполнена, и ползунок работает, но с проблемой ширины страниц слайдов. Эта ширина рассчитывается автоматически с помощью css: transform: translate3d

Когда я использую его локально непосредственно в браузере, он работает так, как ожидалось, как на изображении, это первая загрузка: введите описание изображения здесь

Но в пределах углового я получил это: введите описание изображения здесь

Я использую один и тот же код html и css, а также ту же версию скрипта swiper, доступную в загруженном zip-файле.

Похоже, что существует некоторое другое поведение при преобразовании css3, когда внутри угловой.

Если я посмотрю на результат этого значения, я получил:

element.style {
transform: translate3d(-812px, 0px, 0px);
transition-duration: 0ms;
}

С дочерью div:

element.style {
 width: 812px;
}

Для того, кто работает хорошо, прямо в браузере без углового и:

element.style {
transform: translate3d(326px, 0px, 0px);
transition-duration: 0ms;
}

с дочерью div:

element.style {
width: 296px;
margin-right: 30px;
}

в пределах углового, это для той же ширины браузера. Эта ширина автоматически обновляется с размером окна браузера.

Любая идея, как решить эту проблему, чтобы иметь тот же самый взгляд, используя его внутри углового?

В этом случае я использую угловой 4, и у меня есть этот html внутри шаблона углового ввода компонента.

благодаря

html5,angular,css3,typescript,css-transitions,

0

Ответов: 0

вопрос с css3 transform3d в угловом

У меня есть ползунок, доступный здесь: Слайдер с переходами

И я попытался интегрировать его в свое угловое приложение.

Интеграция была выполнена, и ползунок работает, но с проблемой ширины страниц слайдов. Эта ширина рассчитывается автоматически с помощью css: transform: translate3d

Когда я использую его локально непосредственно в браузере, он работает так, как ожидалось, как на изображении, это первая загрузка: введите описание изображения здесь

Но в пределах углового я получил это: введите описание изображения здесь

Я использую один и тот же код html и css, а также ту же версию скрипта swiper, доступную в загруженном zip-файле.

Похоже, что существует некоторое другое поведение при преобразовании css3, когда внутри угловой.

Если я посмотрю на результат этого значения, я получил:

element.style {
transform: translate3d(-812px, 0px, 0px);
transition-duration: 0ms;
}

С дочерью div:

element.style {
 width: 812px;
}

Для того, кто работает хорошо, прямо в браузере без углового и:

element.style {
transform: translate3d(326px, 0px, 0px);
transition-duration: 0ms;
}

с дочерью div:

element.style {
width: 296px;
margin-right: 30px;
}

в пределах углового, это для той же ширины браузера. Эта ширина автоматически обновляется с размером окна браузера.

Любая идея, как решить эту проблему, чтобы иметь тот же самый взгляд, используя его внутри углового?

В этом случае я использую угловой 4, и у меня есть этот html внутри шаблона углового ввода компонента.

благодаря

00html5, угловые, CSS3, машинопись, CSS-переходы,
Похожие вопросы