全站搜索 登陆 / 注册
Erlo

jQuery(实例)

时间:2019-08-12 15:04   阅读:178次   来源:博客园
页面报错
点赞

1.开关灯效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .hide{
            display: none;
        }
    </style>
</head>
<body>
    <input id="i1" type="button" value="开关" />
    <div class="c1 hide">假装现在有效果了</div>

    <script src="jquery-1.12.4.js"></script>
    <script>
        $('#i1').click(function () {
            #zs# 第一种方法
            if($('.c1').hasClass('hide')){
                $('.c1').removeClass('hide')
            }else {
                $('.c1').addClass('hide')
            }   #fzs#
            //jquery实现方法
            $('.c1').toggleClass('hide')
        })
    </script>
</body>
</html>

View Code

2.模态对话框

 View Code

3.点击菜单显示对应的内容

 View Code

 通过索引实现菜单更方便

4.编辑功能

 View Code

5.模态对话框添加删除功能

 View Code

6.点赞

 View Code

7.随鼠标移动的框

 View Code

8.表单验证

 View Code

9.轮播图

 View Code

10.返回顶部

 View Code

11.左侧菜单

 View Code

12.显示和隐藏

 View Code

13.滑动和隐藏

 View Code

14.添加与删除

 View Code

15.商品放大镜

 View Code

16.商品分类

 View Code

评论留言

还没有评论留言,赶紧来抢楼吧~~

吐槽小黑屋()

* 这里是“吐槽小黑屋”,所有人可看,只保留当天信息。

  • Erlo.vip2019-12-14 23:53:53Hello、欢迎使用吐槽小黑屋,这就是个吐槽的地方。
  • 返回顶部