滚动按钮不起作用,因为我想要它做

时间:2020-07-10 12:24:03

标签: html css

我的网站上有一个按钮,当我进入网站时会自动滚动。 我只希望它在我按下按钮时滚动...

@import url(https://fonts.googleapis.com/css?
 family=Josefin+Sans:300,
400);
* {
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

html,
body {
  height: 100%;
  scroll-behavior: smooth;
}

section {
  position: relative;
  width: 100%;
  height: 100%;
  scroll-behavior: smooth;
}

section::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 80%;
  background-image: url(Bilder/MeetFriendsBackground.jpg);
  background-image: url(Bilder/MeetFriendsBackground.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  scroll-behavior: smooth;
}
<section id="section01" class="demo">
  <h1 class="lamf">Learn about MeetFriends!</h1>
  <a href="#section02"><span></span><scrollbutton><div><button class="scroll">Scroll</button></div></scrollbutton></a>
</section>
<section id="section02" class="demo"></section>

知道我该怎么办的人吗?

1 个答案:

答案 0 :(得分:1)

也许您可以通过应用溢出属性overflow :hidden;

来防止正文滚动
html,
body {
  height: 100%;
  scroll-behavior: smooth;
  overflow :hidden;
}