zoukankan      html  css  js  c++  java
  • div淡出淡入的方法原理

    function click2() {
                var o = document.getElementById("div");
                //在IE中 filters属性控制元素的透明度(类似数组的对象). 原div没有设置透明度.那么o.filters的length为0
                if (o.filters) {
                    o.style.filter = 'alpha(opacity=' + 0 + ')';
                    //设置了filter样式的值(注意 是 style.filter)后,filters属性的length变成1
                    //于是就可以用obj.filters[0].opacity来访问了
                }
                else
                    o.style.opacity = 0; o.style.display = "";
                ShowOrHide(o, 100, 0, function() { alert('回调'); });
            }
            function ShowOrHide(obj, start, end, callback) {            //四个参数,第一个为对象,2为起始,3为目标,4为回调函数            //当起始>目标,则显示,反之则隐藏
                if (obj.filters) {
                    obj.filters[0].opacity = start;
                }
                else
                    obj.style.opacity = start * 0.01;
                if (start != end) {
                    if (start < end)
                        start += 10;
                    else
                        start -= 10;
                    setTimeout(
                        function() {
                            ShowOrHide(obj, start, end, callback)
                            },100);
                }
                else
                    arguments[3].call(null);
            }

    <body>
        <input type="button" id="btn" onclick="click2()" value="222" /><div style="display: none;
             200px; height: 200px; background-color: Red" id="div">
        </div>
    </body
  • 相关阅读:
    picturebox 图片自适应
    C#中如何生成矢量图
    测试ODBC与OLE
    ODBC具体使用
    C#中的OLEDB连接2
    C#中的ODBC、OLEDB连接
    c#执行并行任务之Parallel与TaskFactory
    C# 4.0 新特性之并行运算(Parallel)
    app的下载中心
    第三方库列表
  • 原文地址:https://www.cnblogs.com/jianjialin/p/1767145.html
Copyright © 2011-2022 走看看