Html 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;
}
}

---

我在这里胡乱猜测，因为你的问题不是很清楚，但这里是

在您的表单上有以下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: 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);
}

抱歉，如果我完全弄错了，但这是我最好的猜测，因为您的问题不清楚。
请在问题中包含任何相关代码。您可以更具体一些。谢谢您的回答。由于它是一个基于wordpress的网站，很难分解一些特定的代码。但这里是与活动相关的css。太棒了，它成功了！多谢各位