时间戳

首页 > 解决方案 > 如何在jQuery中向下滑动按钮

jquery - 如何在jQuery中向下滑动按钮

问题描述

我的申请中有提交按钮。当用户单击提交按钮时。我想在 jQuery 或 CSS 中向下滑动提交按钮。有人可以建议怎么做吗？

谢谢

标签： jquerycss

解决方案

每当用户单击按钮元素时，您可以使用以下方法之一将类应用于按钮元素：

查询

$("button").on("click", () => {
  $("button").addClass("clicked");
})
button {
transition: transform 300ms ease
}

.clicked {
  transform: translateY(200px)
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button>Submit</button>

没有jQuery

const button = document.querySelector("button");
button.addEventListener("click", () => {
  button.classList.add("clicked")
})
button {
  transition: transform 300ms ease
}

.clicked {
  transform: translateY(200px)
}
<button>Submit</button>

推荐阅读