web网页设计实现——04.16

最新推荐文章于 2024-06-10 22:03:36 发布

年少轻狂也懂胜者为王

最新推荐文章于 2024-06-10 22:03:36 发布

阅读量6.3k

点赞数 6

分类专栏： lLZM web网页设计实现——04.16 文章标签： web网页设计实现——04.16

本文链接：https://blog.csdn.net/NSQKYDSZWW/article/details/89420752

版权

本文介绍了使用jQuery实现的网页设计技巧，包括二级菜单的淡出淡入效果和如何通过jQuery获取元素的宽度和高度。讲解了show()、hide()、toggle()等动画方法，以及animate()在创建自定义动画中的应用。

摘要由CSDN通过智能技术生成

jQuery的淡出淡入：

1.二级菜单（jQuery实现）

代码：

 1. <!DOCTYPE html>
 2. <html lang="en">
 3. <head>
 4.     <meta charset="UTF-8">
 5.     <title>Title</title>
 6.     <script src="jquery-1.8.3.min.js"></script>
 7.     <style>
 8.         #div1,#div4,#div2,#div3{
 9.             padding: 20px;
 10.             text-align: center;
 11.             background-color: #fffe32;
 12.             border: 1px solid #13ffff;
 13.         }
 14.         #div4{
 15.             padding: 100px;
 16.             display: none;
 17.         }
 18.     </style>
 19.     <script>
 20.         $(document).ready(function () {
 21.             $("#div1").click(function () {
 22.                 $("#div4").slideDown(888);
 23.             });
 24.             $("#div2").click(function () {
 25.

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

年少轻狂也懂胜者为王

关注关注

6
点赞
踩
15

收藏

觉得还不错? 一键收藏
0
评论
web网页设计实现——04.16

jQuery的淡出淡入：1.二级菜单（jQuery实现）代码： 1. <!DOCTYPE html> 2. <html lang="en"> 3. <head> 4. <meta charset="UTF-8"> 5. <title>Title</title> 6. <script...
复制链接

扫一扫