标签: css-transitions

CSS3 webkit动画的交叉兼容浏览器编码?

很想知道我能够将以下内容实现webkit-animation到非webkit浏览器中,例如Firefox,Internet Explorer和Opera?编码是什么?

@-webkit-keyframes FadeIn {
   0% {
    opacity:0;
      }
   100% {
    opacity:1;
      }
}

.object {
    -webkit-animation-name: FadeIn;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: 3s;
}
Run Code Online (Sandbox Code Playgroud)

css css3 css-transitions

-1
推荐指数
1
解决办法
199
查看次数

CSS 从左到右的转换工作正常,从右到左的转换不起作用

如果您访问我的网站:http://warringah- Plastics.com.au/w Plastics,当您将鼠标悬停在主导航中的菜单项上时,您会看到指示箭头显示在其顶部。然后,当您在菜单上从左到右移动鼠标时,CSS 过渡非常平滑。但是,当您从右向左移动时,过渡会突然越过菜单项,看起来不太好。目前我正在将此 CSS 应用于 nav li 元素:

过渡:所有 0.5 秒缓入缓出 0 秒!重要;

我尝试过使用悬停 CSS 进行实验,但没有成功。提前致谢!

css transition css-transitions

-1
推荐指数
1
解决办法
7753
查看次数

jQuery将屏幕加载到纯JavaScript中

我有这个加载屏幕脚本,我想在项目中实现.

但是它需要jQuery.由于页面中没有任何元素需要jQuery,我想节省一些空间并避免添加它.

有什么办法可以用纯JavaScript提供完全相同的功能吗?

HTML:

<body onload="hide_preloader();">    
<div class="preloader"> <div class="loader"></div> </div>
</body>
Run Code Online (Sandbox Code Playgroud)

jQuery的:

jQuery(window).load(function() { rotate = 0; $(".preloader").fadeOut(250); });
Run Code Online (Sandbox Code Playgroud)

谢谢

html javascript css jquery css-transitions

-1
推荐指数
1
解决办法
1669
查看次数

CSS3使用JavaScript吗?

CSS3如何工作?它是否在浏览器中使用JavaScript?因为过渡效果是JavaScript质量!CSS只是造型吗?

我知道我的问题有点奇怪 - 我的老师今天问我这个问题.

javascript rendering css3 css-transitions

-1
推荐指数
1
解决办法
133
查看次数

为什么这个CSS过渡速记不再起作用?

我的基本工作示例代码:

div {
    width: 100px;
    height: 100px;
    background: red;
    -webkit-transition: all 0.25s ease 0s;
    -moz-transition: all 0.25s ease 0s;
    transition: all 0.25s ease 0s;
}
Run Code Online (Sandbox Code Playgroud)

演示

如果我删除0转换前的持续时间并且s在转换延迟之后,则它不起作用:

div {
    width: 100px;
    height: 100px;
    background: red;
    -webkit-transition: all .25s ease 0;
    -moz-transition: all .25s ease 0;
    transition: all .25s ease 0;
}
Run Code Online (Sandbox Code Playgroud)

我问这个问题,因为我的转换正在使用后一个代码,但突然Chrome给了我错误"未知属性名称",我需要将其更改为以前的版本,以使我的转换再次工作.我怎么能解决这个问题,因为我有很多第二种格式的代码.

css google-chrome css3 css-transitions

-3
推荐指数
1
解决办法
454
查看次数