jQuery 中上下滑动效果的使用方法?

 时间:2026-02-13 08:30:30

1、使用一款开发工具。这里我推荐使用editplus。很实用一款开发工具软件

jQuery 中上下滑动效果的使用方法?

2、新建一个html文件,引入jquery类库文件,没有的自己到jquery的官方下载。我就不上传附件了。引入的时候不要出错了啊

jQuery 中上下滑动效果的使用方法?

3、加一个div标签,用来显示效果,加一个input标签,来实现单击事件的效果函数

<div style="width: 300px; height:300px; background-color: pink; display:none;"></div>

<button onclick="f1()">滑动 </button>

jQuery 中上下滑动效果的使用方法?

4、在

 <script language="javascript" type="text/javascript">

<!--

//-->

  </script>

写入js代码:

function f1(){

$("div").slideDown('slow');

}

jQuery 中上下滑动效果的使用方法?

5、运行html文件来查看效果,点击前的效果和点击后的效果

jQuery 中上下滑动效果的使用方法?

jQuery 中上下滑动效果的使用方法?

6、改函数还可以传递两个参数$(selector).slideDown(speed,callback);

speend:速度毫秒

callback:回调函数

例如:

function f1(){

$("div").slideDown(1000,function(){alert("s");});

}

jQuery 中上下滑动效果的使用方法?

  • CSS教程 浮动(float)属性的使用
  • html5水波动态效果,纯css3波纹动态效果源码
  • iframe中元素高度如何设置
  • 如何运用Bootstrap的徽章
  • CSS实现3D照片墙
  • 热门搜索
    兵马俑旅游 东江湖旅游 保定旅游攻略 临朐旅游 酒店旅游 小学生旅游作文 迪庆旅游 新都桥旅游攻略 九寨沟旅游价格 杭州旅游网