如何将图像移动到页面的左中心

时间:2016-05-13 14:28:30

标签: javascript jquery html5 css3 web-deployment

我想知道当我点击它应该移动到左中心时如何移动图像。

代码是

<div id="myanm" >
    <a href="#"><img src="img/home/Services.png" class="service animated fadeInUp img_move">
        <h2 class="txt1 shadow animated fadeInUp">SERVICES</h2>
    </a>
</div>

css文件是

.service{ 
    position:absolute; 
    left:0px; 
    bottom:0; 
    z-index:1;
    animation-delay: 3.5s;
    height:324px; 
    width:433px;
}

虽然已经应用了动画,但我无法执行点击功能。

这是jsfiddle example

1 个答案:

答案 0 :(得分:0)

假设当元素具有service类时动画开始,你可以在`onclick处理程序中执行:

<div id="myanm">
    <a href="#">
        <img src="img/home/Services.png" class="animated fadeInUp img_move" onclick="this.classList.add('service');">
        <h2 class="txt1 shadow animated fadeInUp">SERVICES</h2>
    </a>
</div>