今天做WordPress外贸网站的时候,客户提出了一个图片缓慢上移的要求。

可以通过css来实现这个效果,

img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail.wp-post-image{ transition: all .5s;}

img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail.wp-post-image:hover {
     cursor: pointer;
    transform: translate(0,-5px);background:#060606;filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8;

}


通过上面代码,鼠标经过图片,就可以实现缓慢上移的效果。


213.jpg

相关文章:
  • 通过css让DIV实现淡入的动画特效的方法
  • 网页form表单新窗口打开的设置方法