• jQuery效果之显示与隐藏


    .hide([duration][,complete])——目标元素的隐藏。

    .show([duration][,complete])——目标元素的显示;

    .toggle([duration][,complete])——当目标元素隐藏时则显示。否则隐藏。

    注:可选參数[duration]为方法运行的时间区间;[,complete]为回调函数。

    <!DOCTYPE html>
    <html lang="zh_CN">
    <head>
        <meta charset="UTF-8">
        <title>显示与隐藏</title>
        <script src="js/jquery-2.1.3.min.js"></script>
        <script src="js/my.js"></script>
        <style>
            div{
                background: #005599;
                 100px;
                height: 100px;
                margin: 5px;
                float: left;
            }
        </style>
    </head>
    <body>
    <img src="images/g.jpg"/>
    <button id="btn1">隐藏</button>
    <button id="btn2">显示</button>
    <button id="btn3">隐藏/显示</button>
    
    </body>
    </html>


    my.js代码部分:

    /*显示与隐藏*/
    $(document).ready(function(){
        //隐藏
        $('#btn1').click(function(){
            //$('img').hide();
            $('img').hide(1000);
        });
        //显示
        $('#btn2').click(function(){
            //$('img').show();
            $('img').show(1000);
        });
        //切换显示与隐藏
        $('#btn3').click(function(){
            //$('img').toggle();
            $('img').toggle(1000);
        });
        //利用hide()制作一个效果
        for(var i=0;i<5;i++){
            $("<div>").appendTo(document.body);
        }
        $('div').click(function(){
            $(this).hide(2000,function(){
                $(this).remove();
            })
        })
    })
    





  • 相关阅读:
    参考__JAVA
    债券价格和通胀率
    C++ 面试题
    欧式和美式期权
    explicit
    smart pointer
    const pointer
    manacher-马拉车算法
    输入有空格的字符串的2种方法
    bind()与connect()——计网中socket的使用
  • 原文地址:https://www.cnblogs.com/tlnshuju/p/6876798.html
Copyright © 2020-2023  润新知