使用时css的意外行为:悬停,发生了什么?

时间:2013-02-27 22:13:43

标签: html css css-transitions

我发现这个:hover效果有问题,这是我以前从未见过的。 当我在div“box”上:hover时......这会改变背景的一部分......

谢谢!

CSS FOR SECTIONS

.first { background:#fff; width:100%; height:auto; position:relative;}     

.second {background-image:url(../images/body/1.jpg); background-attachment:fixed;width:100%; height:auto; position:relative; display:inline-block;}

HTML

<div class="span4 one">
    <i class=" icon-4x icon-beaker">
    </i>
    <h2>
        Awesome
    </h2>
    <p>
        Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam
        id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta
        ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel
        scelerisque nisl consectetur et.
    </p>
    <button type="submit">
        shown more
    </button>
</div>  

CSS FOR BOXES

 .boxes .span4{text-align:center; padding:10px 0; display:inline;
    -webkit-transition: all 300ms linear;
       -moz-transition: all 300ms linear;
         -o-transition: all 300ms linear;
        -ms-transition: all 300ms linear;
            transition: all 300ms linear;}

==>.boxes .span4:hover {background: rgba(51,153,255,0.1);}<=== 

1 个答案:

答案 0 :(得分:1)

看起来background-attachment: fixed;没有线转换(它基本上改变了背景图像的固定位置,具体取决于它在Y轴上平移的元素)