今天做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; }
通过上面代码,鼠标经过图片,就可以实现缓慢上移的效果。