Question

好的，所以我得到了这一轮。

<div id = "dot"></div>

使用此样式，当您将鼠标悬停在屏幕上时，它会离开屏幕。

#dot {
  height: 75px;
  width: 75px;
  background-color: red;
  border-radius: 50%;
  margin: 0 auto;
  position: relative;
  top: 30vh;
  transition: all 2s;
}

#dot:hover {
  top: -1000vh;
}

#dot {
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}

我希望在点击点时发生屏幕上的飞行转换，并且我正在寻找纯CSS或vanilla javascript的解决方案。如果它有任何意义，那么点最终将被包裹在一个链接元素中，并且其戏剧性的退出将预示着新页面的负载。

奖金问题：如果这个圆形div最终有一个SVG，那会对它的性能/外观产生负面影响吗？

Answer 1

您可以通过向@RunWith(SpringRunner.class) @SpringBootTest @WebAppConfiguration public class WiremockTest { @ClassRule public static WireMockRule wireMockRule = new WireMockRule(options().port(8888).notifier(new ConsoleNotifier(true))); @Test public void testStub() { wireMockRule.stubFor(get(urlEqualTo("/test")) .willReturn(aResponse() .withHeader("Content-type", "application/json").withStatus(200))); } }添加tabindex并将CSS从div更改为:hover来完成此操作。

（别忘了删除大纲）。

＆＃13;

:focus

＆＃13;

#dot {
  height: 75px;
  width: 75px;
  background-color: red;
  border-radius: 50%;
  margin: 0 auto;
  position: relative;
  top: 30vh;
  transition: all 2s;
}

#dot:focus {
  top: -1000vh;
  outline: none;
}

#dot {
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}

＆＃13;

如何点击屏幕上的div飞？

1 个答案: