css 弹跳向下滚动箭头

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css 弹跳向下滚动箭头相关的知识，希望对你有一定的参考价值。

.hero__scroll {
  position: absolute;
  bottom: 60px;
  width: 200px;
  margin: auto;
  display: block;
  cursor: pointer;
  padding-bottom: 40px;
  left: 0;
  right: 0;
  text-transform: uppercase; }
  .hero__scroll .chevron {
    margin-top: 20px;
    display: block;
    -webkit-animation: pulse 2s infinite;
            animation: pulse 2s infinite;
    color: #FF4081; }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }

@keyframes pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } }

以上是关于css 弹跳向下滚动箭头的主要内容，如果未能解决你的问题，请参考以下文章

css 弹跳箭头

UIScrollview 弹跳和缩放固定顶部

css 防止狮子弹跳滚动

使用 css 撤消滚动条样式

在目标 c 的 UITableView 中显示指示用户向上或向下滚动的箭头

Wordpress 向下滚动箭头到页面的一部分