首页 > 解决方案 > 链接 Pulse 按钮​​并使表格消失

问题描述

嘿伙计们,我无法将我的脉冲按钮链接到相应的表格,我的代码已附上,任何人都可以提供一些反馈,说明如何根据点击脉冲按钮一次只显示一个表格?

https://codepen.io/jmrowe0231/pen/KGVYLp

label div.pulse-button {
  position:relative;
  width: 25px;
  height: 25px;
  border: none;
  box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);
  border-radius: 50%;
  background-color: #00aed6;
  background-image: url(http://image.carnivalcruiselineemail.com/lib/fe9513727761047c7c/m/10/plus_icon.png);
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}

label[for=Mexico1] div.pulse-button {
  left: -143px;
  top: -175px;
}

label[for=Mexico2] div.pulse-button {
  left: 280px;
  top: -192px;
}

label[for=Mexico3] div.pulse-button {
  left: -243px;
  top: -278px;
}

 @ -webkit-keyframes pulse {
 to {
 box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
}
}
 @-moz-keyframes pulse {
 to {
 box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
}
}
 @-ms-keyframes pulse {
 to {
 box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
}
}
 @keyframes pulse {
 to {
 box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
}

标签: htmlcss

解决方案


推荐阅读