问题标签 [webkit-transform]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
40 浏览

javascript - 难住了,Div 将到处旋转,但不在我的主页内

前两个链接显示一个工作的旋转图标,但我希望它工作的第三个链接将无法正常工作......

https://jsfiddle.net/752tfqyu/17/

我创建的 JSfiddle 有效。当我把 JSfiddle 中的所有内容并在服务器上测试它时:它不起作用:http ://cdubach.com/inc/test.php

http://cdubach.com/pages/home/index.php 我有一个问题,图标不会旋转。

用于旋转图标的主要 Javascript/Jquery;

0 投票
1 回答
66 浏览

javascript - WebkitTransform 不流畅

我正在尝试使用 jquery 旋转元素。我的问题是元素旋转不流畅,但速度从一开始就在增加,在旋转结束之前降低。有没有办法流畅地旋转元素?谢谢。

0 投票
0 回答
81 浏览

html - 水平对齐旋转的文本

我想水平居中对齐一些已旋转 90 度和 270 度的文本(按照此处的建议)与其相邻的 div(其高度可以在我的应用程序中更改)。一些常见的技巧似乎不起作用,因为元素是水平创建和处理的,然后是旋转的。

这是一个演示问题的小提琴。提前致谢。

HTML:

CSS:

0 投票
2 回答
1150 浏览

javascript - 为什么 `style.webKitTransition` 和 `style.webkitTransform` 在 Chrome 中不再起作用?

这些行:

100% 的人工作不超过一年。我删除了非常陈旧的 repo 以添加另一个功能,但是当我查看页面时,规模不再起作用。我将我的更改HEAD为正确的提交,我确信它正在工作,但scale仍然无法正常工作。

在运行时检查元素,这就是我所看到的

但在视觉上,TEST文本没有发生任何事情

我需要使用的方式有什么改变webkitTransitionwebkitTransform

0 投票
2 回答
64 浏览

css - 动画不起作用 CSS

我正在尝试为我的 CSS 类添加一些动画这是代码:

一切都很好,但这部分不起作用:

0 投票
0 回答
115 浏览

jquery - 如何使用 jQuery 以编程方式设置 webkit-transform?

我正在尝试使用 jQuery 设置 transform3d 属性。为此,我正在使用以下功能;

然后,我使用以下函数打印值以查看它是否已更改;

但是,它总是返回 [0, 0, 0]

0 投票
2 回答
3328 浏览

mobile - 在 Safari 中滚动时元素消失 - -webkit-transform 修复仅在第一次有效

这只发生在 iPhone 大小的 Safari 中。我知道这个问题的“通常修复”是应用 -webkit-transform: translate3d(0,0,0); (根据 Serge在此处的回答),这确实解决了这个问题,但只有一次。

用户单击菜单按钮时打开的“抽屉”菜单会出现此问题。菜单将正常显示,但是当用手指触摸/滚动时,整个菜单将从页面中消失。应用-webkit-transform: translate3d(0,0,0)解决了这个问题,但只是第一次。如果菜单关闭并再次打开,问题会再次出现。我已经确认该-webkit-transform: translate3d(0,0,0)属性仍然存在(但是它在 Safari 开发人员工具中显示为灰色 - 显示为灰色,没有划掉一条穿过它的线)。

我在页面中添加了一些 JavaScript,以便在打开菜单时,它会将 -webkit-transform: translate3d... 属性应用于菜单,虽然这确实可以永久解决问题,但我认为它不够干净是一个真正的修复。

我还尝试在父元素、子元素等上应用-webkit-overflow-scrolling: touch各种组合-webkit-transform: translate3d(0,0,0),并且无法解决“第一次尝试”之外的问题。

0 投票
3 回答
395 浏览

css - 如何反转这个圆圈动画?

我在网上找到了这段代码片段,我试图将其反转,以便圆圈从 0% 的全白渐变到 100% 的渐变圆圈,然后停止动画。但是我似乎无法弄清楚倒车部分。我试过摆弄这些值,但似乎无法获得预期的效果。摆脱渐变部分未显示后仍然存在的小轮廓也很好。干杯

0 投票
2 回答
2721 浏览

css - 如何在 CSS 中将 hr 线旋转 90 度并在其前面放置文本?

我有以下 CSS 结构,这有点复杂。完整的代码放在这个 JSFiddle 中,我正在努力解决我需要在那里实现的最后一个想法。

在水平线(与圆圈一致)之间,我需要将附加线旋转 90 度并在其前面放置一些文本。它应该看起来像这张图片,我在其中添加了红色的缺失元素。

我已经尝试从上面的链接中实现类似的东西,但它没有按预期工作。请注意,HTML 中也有一些内联 CSS,它们本质上是动态的,并且是在运行时生成的。

作为说明,我尝试添加这个新的 HTML 元素,但我宁愿不使用内联样式来添加这些行(如果可能)。这是新添加元素的 CSS 和 HTML:

0 投票
0 回答
65 浏览

html - 未解决的 CSS 冲突,webkit-transform 导致重叠

我正在使用Canvas模板制作网站。我正在尝试将翻转卡中的元素与其他元素结合起来。特别是模态框和灯箱,但翻牌文字一直在起作用,这里有一些截图:

模态错误

导航栏错误

如您所见,翻转卡片文本不仅会干扰模式框,还会干扰导航栏。

我想我把它缩小到这个类:

当我删除

重叠消失了,但是翻转卡被破坏了。

我怎样才能解决这个问题?