【代码笔记】HTML+CSS+JAVAScript+jQuery点击图标下滑列表

这篇博客介绍了如何利用HTML、CSS、JavaScript和jQuery实现点击图标后列表下滑的动画效果,主要使用了slideToggle函数来实现。
摘要由CSDN通过智能技术生成

原理:同前一篇,不过使用的是sildeToggle方法。

具体思路:同前一篇。

具体实现代码:

JS文件:

function showSort() {
	$("#sort").click(function() {
		$("#u_list3").stop().slideToggle(100);
	}, function() {
		$("#u_list3").stop().slideToggle(100);
	});
}

HTML/JSP文件(JSP文件):

<div id="sort">
	排序
	<ul id="u_list3" style="display:none;">
		<li><a href="sort.do?op=id">ID</a></li>
<span style="white-space:pre">	</span>	<li><a href="sort.do?op=name">姓名</a></li>
		<li><a href="sort.do?op=salary">薪水</a></li>
		<li><a href="sort.do?op=age">年龄</a></li>
	</ul>
</div&
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值