淘先锋技术网

首页 1 2 3 4 5 6 7

jQuery是一个广泛应用在网站开发中的Javascript库,它可以方便地操作HTML元素,实现网页效果。在网页设计中,经常会有隐藏、显示元素的需求。下面我们将介绍用jQuery实现点击按钮上滑隐藏的方法。


$(document).ready(function(){
     $("button").click(function(){
         $("p").slideUp();
     });
});

jquery点击按钮上滑隐藏

首先,在HTML中创建一个按钮和一个段落。




我是被隐藏的段落。

接下来,使用jQuery的slideUp()函数,当按钮被点击时,段落就会被上滑隐藏。

代码讲解:

当文档加载完后,jQuery会开始执行ready()方法内的代码。在ready()方法中,我们监听按钮的点击事件。


$("button").click(function(){...});

当按钮被点击后,我们选择要隐藏的元素p,使用slideUp()方法让其上滑隐藏。


$("p").slideUp();

如此简单,一个点击按钮上滑隐藏的效果就完成了。