主页 / 问题 / 759395
Accepted
tonymore
Asked:2020-12-17 09:40:21 +0000 UTC2020-12-17 09:40:21 +0000 UTC

复选框闪烁

  • 772

再会 ！
有一个样式为 的复选框label。
当您将鼠标悬停在复选框上时，它会闪烁一次，激活后它也会闪烁一次，这是什么问题？ 

.checkbox {
  cursor: pointer
}

.checkbox:before {
  display: block;
  cursor: pointer;
  content: '';
  float: left;
  background: url(/img/svg/check_box_before.svg);
  margin: 0 7px 0 0;
  width: 15px;
  height: 15px
}

.checkbox:hover:before {
  background-image: url(/img/svg/check_box_hover.svg)
}

.checkbox.on:before {
  background-image: url(/img/svg/checkbox_before.svg)
}

.checkbox.on:hover:before {
  background-image: url(/img/svg/checkbox_hover.svg)
}
<input type="checkbox" id="checkID" name="checkID" value="false" />
<label for="checkID" class="checkbox " onclick="anonymousCheckbox(event, this)"><span></span>анонимно</label>

html

1 个回答

  1. Best Answer

    如何消除复选框闪烁？

    在英文堆栈中摸索发现了一个类似的问题。
    解决问题的方法很简单，只需要预加载SVG.
    CSS：

    body:after{
 display:none;
 content: url(/путь_до_файла/файл.svg);
}
    • 2

相关问题