CSS3 – 有爱前端 http://gzui.net 贵在有爱 Mon, 27 Feb 2023 05:55:36 +0000 zh-CN hourly 1 https://wordpress.org/?v=5.8.9 css机器人动画 http://gzui.net/archives/4223 http://gzui.net/archives/4223#respond Mon, 27 Feb 2023 05:55:36 +0000 http://gzui.net/?p=4223

提示:你可以先修改部分代码再运行。

转载请注明:有爱前端 » css机器人动画

]]>
http://gzui.net/archives/4223/feed 0
多行展开收起自动隐藏 http://gzui.net/archives/3438 http://gzui.net/archives/3438#respond Wed, 19 May 2021 09:44:02 +0000 http://gzui.net/?p=3438 https://juejin.cn/post/6963904955262435336

https://mp.weixin.qq.com/s/P8I8za6S1QG20MGg-2BnjQ

多行展开收起自动隐藏(全兼容)

提示:你可以先修改部分代码再运行。

多行展开收起自动隐藏

提示:你可以先修改部分代码再运行。

转载请注明:有爱前端 » 多行展开收起自动隐藏

]]>
http://gzui.net/archives/3438/feed 0
css3 input 样式 http://gzui.net/archives/1070 http://gzui.net/archives/1070#comments Fri, 25 Dec 2015 02:53:59 +0000 http://www.gzui.net/?p=1070

提示:你可以先修改部分代码再运行。

转载请注明:有爱前端 » css3 input 样式

]]>
http://gzui.net/archives/1070/feed 2
逆天人物rem http://gzui.net/archives/707 http://gzui.net/archives/707#respond Tue, 14 Jul 2015 05:44:48 +0000 http://www.gzui.net/?p=707

提示:你可以先修改部分代码再运行。

转载请注明:有爱前端 » 逆天人物rem

]]>
http://gzui.net/archives/707/feed 0
input type=”checkbox” 漂亮的开关 http://gzui.net/archives/608 http://gzui.net/archives/608#comments Tue, 23 Jun 2015 04:12:55 +0000 http://www.gzui.net/?p=608

提示:你可以先修改部分代码再运行。

转载请注明:有爱前端 » input type=”checkbox” 漂亮的开关

]]>
http://gzui.net/archives/608/feed 1
IE6、IE7兼容querySelectorAll和querySelector方法-最终版本 http://gzui.net/archives/293 http://gzui.net/archives/293#respond Tue, 26 May 2015 05:28:32 +0000 http://www.gzui.net/?p=293 querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的。他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素。
目前几乎主流浏览器均支持了他们。包括 IE8(含) 以上版本、 Firefox、 Chrome、Safari、Opera。

querySelector 和 querySelectorAll 方法很好用,可惜IE6、IE7不支持,怎么让IE6、IE7也支持querySelectorAll和querySelector这两个方法呢,请看下面的代码:

if (!document.querySelectorAll) {
    document.querySelectorAll = function (selectors) {
        var style = document.createElement('style'), elements = [], element;
        document.documentElement.firstChild.appendChild(style);
        document._qsa = [];

        style.styleSheet.cssText = selectors + '{x-qsa:expression(document._qsa && document._qsa.push(this))}';
        window.scrollBy(0, 0);
        style.parentNode.removeChild(style);

        while (document._qsa.length) {
            element = document._qsa.shift();
            element.style.removeAttribute('x-qsa');
            elements.push(element);
        }
        document._qsa = null;
        return elements;
    };
}

if (!document.querySelector) {
    document.querySelector = function (selectors) {
        var elements = document.querySelectorAll(selectors);
        return (elements.length) ? elements[0] : null;
    };
}

// 用于在IE6和IE7浏览器中,支持Element.querySelectorAll方法
var qsaWorker = (function () {
    var idAllocator = 10000;

    function qsaWorkerShim(element, selector) {
        var needsID = element.id === "";
        if (needsID) {
            ++idAllocator;
            element.id = "__qsa" + idAllocator;
        }
        try {
            return document.querySelectorAll("#" + element.id + " " + selector);
        }
        finally {
            if (needsID) {
                element.id = "";
            }
        }
    }

    function qsaWorkerWrap(element, selector) {
        return element.querySelectorAll(selector);
    }

    // Return the one this browser wants to use
    return document.createElement('div').querySelectorAll ? qsaWorkerWrap : qsaWorkerShim;
})();

http://www.cnblogs.com/jacktang/p/4253249.html

转载请注明:有爱前端 » IE6、IE7兼容querySelectorAll和querySelector方法-最终版本

]]>
http://gzui.net/archives/293/feed 0