CSS3 + Javascript - 将-ms-transition:opacity 1s easy-in-out;仅在IE 10中工作? [英] CSS3 + Javascript - Will -ms-transition:opacity 1s ease-in-out; work in IE 10 alone?

查看:98
本文介绍了CSS3 + Javascript - 将-ms-transition:opacity 1s easy-in-out;仅在IE 10中工作?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我今天一直在玩一些CSS3 + JavaScript。

I have been playing around with some CSS3 + JavaScript today.

下面你有我的代码,(试图制作世界上最小的图片淡入画廊,不要'知道我是否成功了。)

Below you have my code, (was trying to make the world's smallest image fading gallery, don't know if I succeeded).

我不太确定如何设置CSS。请参阅以下评论问题:

I am not quite sure how to set the CSS though. See comment questions below:

-ms-transition:opacity 1s ease-in-out; // Will this allone work in IE 10?       
transition:opacity 1s ease-in-out; // Why do we set this?

也许是世界上最小的JS-Gallery:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HB - CSS3 + JS Gallery</title>
<meta charset="utf-8">
<style type="text/css">
body{margin:0;text-align:center;font:200px/500px georgia}
#g{background:#000;margin:0 auto;width:960px;height:500px;overflow:hidden}
#g div{
-webkit-transition:opacity 1s ease-in-out;
-moz-transition:opacity 1s ease-in-out;
-o-transition:opacity 1s ease-in-out;
-ms-transition:opacity 1s ease-in-out;      
transition:opacity 1s ease-in-out;
opacity:0;position:absolute;height:500px;width:960px;}
</style>
</head>
<body>
<div id="g">
<div style="background:#090">1</div>
<div style="background:#096">2</div>
<div style="background:#963">3</div>
<div style="background:#CC0">4</div>
</div>
<script>
function i(){c[a].style.opacity='1'}function o(){c[a].style.opacity='0'}var g=document.getElementById('g'),c=g.children,l=c.length-1,f=function(){if(a==l){o();a=0;i()}else{o();a++;i()}};a=0;i();setInterval(f,4000);
</script>
</body>
</html>


推荐答案

-ms-transition:opacity 1s ease-in-out; // Will this allone work in IE 10?

如果Microsoft实施了转换的特定于供应商的实现在Internet Explorer中,这将由 -ms-transition 属性声明触发,假设参数符合他们已实现的规范。

If Microsoft have implemented a vendor-specific implementation of transition in Internet Explorer then this will be triggered by the -ms-transition property declaration, assuming that the arguments meet the specification they've implemented.

我可以使用表明IE 10确实实现了 -ms-transition 属性, MSDN条目也是如此,虽然它在哪个版本的IE中实现的非特定... ...

Can I Use suggests that IE 10 has, indeed, implemented the -ms-transition property, as does the MSDN entry, though it's non-specific as to which version of IE this is implemented in...

transition:opacity 1s ease-in-out; // Why do we set this?

我们设置此项以便一旦标准实施过渡已完成并实施,这将覆盖任何临时特定于供应商的实现

We set this in order that once the standard implementation of transition is finalised and implemented this will override any interim vendor-specific implementations

这篇关于CSS3 + Javascript - 将-ms-transition:opacity 1s easy-in-out;仅在IE 10中工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆