我正在尝试将div背景图像悬停更改为新图像,并且它可以正常工作,但是,当交换图像时,它会稍微移动。有没有办法消除这种转移效应?
.temptext {
background: url("my-img1.png");
background-size: 35% 33%;
background-repeat: no-repeat;
height: 100%;
width: 100%;
position: absolute;
margin-left: 33%;
margin-top: 38%;
}
.temptext:hover {
background: url("my-img2.png");
background-size: 35% 33%;
background-repeat: no-repeat;
background-position-x: 3.6px;
background-position-y: -.35px;
}
我尝试使用background-position-x / y来指定像素偏移,这几乎完全消除了像素偏移,但是我现在已经手动降低到小数点后的百万分之一,并且仍在稍微偏移。有什么建议或替代解决方案吗?
最佳答案
您应该将两个图像合并为一个精灵,以避免闪烁。
关于html - 消除悬停时的div移位,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44079754/