问题与css过渡和背景图像

-2

我正在网站上工作的地方，当我们将鼠标悬停在表格上我的问题是：如何修复和设置背景图片我为了显示时它是动画的（因此填充增加）但不是从左到右滑动？问题与css过渡和背景图像

你有什么想法吗？

最佳，

这里是CSS代码

body .cf7-style.cf7-style-15648 { 
    transition: all 1.5s; 
} 
.sent { 
    background-image: url("http://www.site.fr/wp-content/uploads/2017/03/perverse-paul-serre.gif") !important ; 
    background-position: right bottom; 
    background-repeat: no-repeat; 
    padding-right:205px !important; 
} 
.col.span_12.color-dark.left{ 
display: flex; 
    justify-content: center; 
    align-items: center; 
} 
form.wpcf7-form.demo.cf7-style.cf7-style-15648:hover{ 
padding-right: 205px; 
    transition: all 0.6s ease-in-out; 
} 
form.wpcf7-form.demo.cf7-style.cf7-style-15648{} 
body .cf7-style.cf7-style-15648{ 
padding-right: 10px; 
} 

@media only screen and (max-width: 767px){ 
.col.span_12.color-dark.left{ 
    display: block; 
} 
    form.wpcf7-form.demo.cf7-style.cf7-style-15648{ 
    width:100%; 
     border:none; 
     padding-right:205px; 
    } 
    .col.span_12.color-dark.left{ 
    margin-left: 10px; 
    } 
    .vc_col-sm-7.wpb_column.column_container.col.no-padding.color-dark{ 
     display: flex; 
    justify-content: flex-end; 
} 
}

来源

2017-03-19 Bergenist

请在问题中加入任何相关的代码 –

你能更具体吗？ –

谢谢你的回答。由于这是一个基于WordPress的网站，因此很难拆开一些特定的代码。但这里是与事件相关的CSS。 – Bergenist

我瞎猜这里你的问题不是很清楚，但在这里不用...

在你的表格你有以下CSS

body .cf7-style.cf7-style-15648:hover { 
    background-image: url(http://www.test.bonnetdejour.fr/wp-content/uploads/2017/03/paul-form-1.gif); 
    background-position: right bottom; 
    background-repeat: no-repeat; 
}

这是设置background-position上徘徊。当你不徘徊在表格上，这将是使用的默认背景位置：

background-position: left top;

如果你设置元素的背景位置，而悬停我认为它会做你想要什么。

body .cf7-style.cf7-style-15648{ 
    background-position: right bottom; 
    background-repeat: no-repeat; 
} 

body .cf7-style.cf7-style-15648:hover { 
    background-image: url(http://www.test.bonnetdejour.fr/wp-content/uploads/2017/03/paul-form-1.gif); 
}

对不起，如果我把它都弄错了，但这是我最好的猜测，因为你的问题不清楚。

来源

2017-03-20 09:37:20 lukehillonline

太棒了！非常感谢 – Bergenist

问题与css过渡和背景图像

回答

相关问题