猫头鹰滑块问题。悬停时导航按钮闪烁

Question

任何人都可以告诉我为什么owl滑块的导航按钮在悬停时会闪烁？ 这些是＆＃39; +＆＃39;加号图像。 http://kmg.makingconnection.co.uk/

谢谢你＆＃39; dingo_d＆＃39;。做左：0＆amp;右：0和位置：绝对解决了我的问题。

Answer 1

你的按钮在0.5处有不透明度，当你悬停时，不透明度变为1

.owl-theme .owl-controls.clickable .owl-buttons div:hover {
    filter: Alpha(Opacity=100);
    opacity: 1;
    text-decoration: none;
}

因为您使用背景作为加号，所以每次将鼠标悬停在它上面时，您显然会触发导致闪烁的更改。最好使用伪元素（即使你将不透明度调低，你可以看到一些重叠）

#owl-demo .owl-prev{
    float: left;
    margin-left: 65px;   
    font-size: 0;
    width: 32px;
    height: 31px;
    position:relative;
    background:transparent;

}

#owl-demo .owl-prev:before,
#owl-demo .owl-prev:after{
    content:"";
    position:absolute;
    top:0;
    left:50%;
    margin-left:-4px;
    width:8px;
    height:32px;
    border-radius:3px;
    background: #ED1B34;
    opacity:0.5;
}

#owl-demo .owl-prev:after{
    transform: rotate(90deg);
}

#owl-demo .owl-prev:hover:before,
#owl-demo .owl-prev:hover:after{
    opacity:1;
}