Question

For some reason, I can not click on links that are in animated divs. They are some clouds that move arround.

html:

<div class="container">
  <div id="clouds">
    <div class="cloud1"><a href="/pages/porfolio.html"><img src="../images/cloud_portfolio.png"/></a></div>
    <div class="cloud2"><img src="../images/clouds_customer.png"/></div>
  </div>
</div>

css:

.container {
  width: 1100px;
  position: absolute;
  top: 80px;
  height: 200px;
  overflow: hidden;
  margin: 0 auto;
  z-index:1;
}
#clouds {
  top: 50px;
  position: relative;
  -webkit-animation: move 40s infinite linear;  
  -moz-animation: move 40s infinite linear;  
  -ms-animation: move 40s infinite linear;
  z-index: 2;

}
#clouds a{
  cursor:pointer;
    text-decoration: none;
 }

Answer 1

I’ve never worked with CSS-animation but isn’t it possible that you move the images under another element thus making the links unclickable? Are you seeing this in every browser and does removing the animation really make a difference?