Question

我将如何处理，以便当用户点击图像时，它会将他们带到另一个页面，虽然不会破坏过渡，因为我尝试的所有内容都可以工作，但会删除过渡或使其中一个图像消失

HTML

<div class="box1"> 
<img class="bottom" src="images/eventbox2.png"/>
<img class="top" src="images/eventbox.png"/>
</div>

CSS

.box1 {
  width:430px;
  height:450px;
}


#imagetrans {
  position:relative;
  margin:0 auto;
}

#imagetrans img.top:hover,
#container > div img.top:hover {
  opacity:0;
  margin:0 auto;
}

#imagetrans img,
#container > div img {
  position:absolute;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}

有什么想法吗？

Answer 1

您是否尝试在CSS中添加“a”

#imagetrans img,
#container > div img a {
    position:absolute;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}

如何在不破坏过渡CSS / HTML的情况下添加链接

1 个答案: