必须在 IE9 中运行代码并且遇到 CSS3 转换问题。
为了这件事把目光转向了 velocity js。
不知道转换为速度代码。
我也试过 jquery css 在 IE9 中不起作用:
$('target').velocity();
我怎样才能让这个过渡 css3 适应速度参数?
transition:left 0.5s ease;
最佳答案
首先,我们都知道 transition CSS 属性支持 IE10+,你可以从 this article 查看它。 .
I tried jquery css didn't work in IE9:
$('target').velocity();
关于这个问题,请检查你的JQuery选择器,确保你能找到基于元素选择器的Html元素(而不是使用类选择器(如:$(".target"))或id选择器(如如:$("#target"))).
那么可以尝试使用F12开发者工具查看速度引用加载是否成功,是否有错误。
How could I make this transition css3 to fit in to velocity parameter ?
来自velocity document ,我们可以使用 Easing 选项来设置缓动类型,使用 Delay 以毫秒为单位指定延迟选项以在动画开始之前插入暂停。更详细的设置,请查看velocity文档。
这是一个示例,您可以引用:
<head>
<meta charset="utf-8" />
<title></title>
<link href="Scripts/velocity/style.css" rel="stylesheet" />
</head>
<body>
<p>
Refresh this page to re-run the demo.
</p>
<div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/velocity/1.5.0/velocity.min.js'></script>
<script src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/2/velocity.ui.min.js'></script>
<script type="text/javascript">
$("div").velocity({ width: "500px" }, { easing: "ease", delay: 500, duration: 1500 });
</script>
</body>
CSS 代码:
body {
font-family: "Helvetica Neue", Helvetica;
width: 90%;
font-weight: 200;
letter-spacing: 1px;
margin: 25px auto 0 auto;
background: rgb(234, 235, 235);
color: rgb(25, 25, 25);
}
div, p {
margin: 0 auto;
}
p {
color: rgb(125, 125, 125);
font-size: 0.85rem;
text-align: center;
margin-bottom: 17px;
}
div {
width: 35%;
overflow: hidden;
}
结果如下:
关于jquery - velocity.js 可以实现 CSS3 过渡吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56874506/