Как сверстать такие dots в fullPage.js?

Question

Чтобы активный маркер увеличивался - понятно. А как сделать чтобы еще внешний круг появлялся с подсветкой? Спасибо

Answer 1

body {
  margin: 30px;
  background-color: black;
}

span {
  display: block;
  position: relative;
  width: 10px;
  height: 10px;
  background-color: blueviolet;
  border-radius: 100%;
}

span:hover {
margin-left: -1px;
margin-top: -1px;
}

span:hover:after {
  content: "";
  display: block;
  position: absolute;
  top: -7px;
  left: -7px;
  width: 21px;
  height: 21px;
  border: 2px solid blueviolet;
  border-radius: 100%;
}

span:hover {
  zoom: 1.2;
}

<span></span>

БЛОГ НА HUSL

Как сверстать такие dots в fullPage.js?

Ответы (1 шт):