CSS3 背景过渡

标签 css transitions

所以我想准确地重新创建色带过渡 http://subtlepatterns.com/但是我做错了。我的丝带图像是 140x160 [width,height],但悬停时没有任何反应。

我把:

#toplogo {
    position: absolute;
    left: 400px;
    background-position: 0px -10px;
    z-index: 5000;
}


#toplogo a {
    background: url('ribbon.png') no-repeat;
    width: 140px;
    height: 160px;
    display: block;
    background-position: 0px -10px;
    text-indent: -9999px;
    -webkit-transition: 0.10s ease-in;
    -moz-transition: 0.10s ease-in;
}



<div id="toplogo"> <a href="/">hello</a> </div>

最佳答案

在 CSS 中添加 -

#toplogo a:hover{
  background-position: 0px 0px;
}

关于CSS3 背景过渡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11050199/

相关文章:

c# - 动画受面板限制

html - 在具有低优先级 z-index 的图层上进行内容分层和禁用滚动

jquery - 在悬停面板上显示黄色方 block

android - 场景与 fragment 和 View

.removeClass/.addClass atr 上的 jQuery 平滑过渡

html - 如何在悬停父元素时向子元素添加 CSS3 过渡

c++ - 伺服转换应该具有什么抽象级别?

javascript - 带有固定标题的 HTML 表格?

css - Stylelint - 确保类名称前缀与文件夹名称匹配

c# - 如何禁用回发或编码查询字符串 ASP.NET