来了老弟，自定义加载图标

我想，在我们编写页面的时候，我们往往都是会尽可能的令页面变得更加的美观（这个应该木有错吧☺），还有就是这个页面让人看起来有无比舒服的感觉。当然，要做到后面这点很难，毕竟每个人得审美是不一样的

而接下来我要讲的这个加载图标呢也是一样的，你可以用一张图片，又或是自己写一个小样式都可以（最主要的是至少自己要觉得好看）。

好了，现在我们就来看一下它如何应用到页面上去的吧，要把自己喜欢的样式应用成加载项也是非常的简单的（两句代码搞定）
下面我们就来看一下具体代码是如何的

<div class="socket" id="zairu">    
                        <div class="gel center-gel">
                            <div class="hex-brick h1"></div>
                            <div class="hex-brick h2"></div>
                            <div class="hex-brick h3"></div>
                        </div>
                        <div class="gel c1 r1">
                            <div class="hex-brick h1"></div>
                            <div class="hex-brick h2"></div>
                            <div class="hex-brick h3"></div>
                        </div>
              </div>



var b = document.getElementById("zairu");
        b.style.display = "block";
        b.style.display = "block"; 

上面这两句代码就是先把这个样式的id（zairu）赋值于所声名的b，然后再让它的状态为显示状态即可（记得要css那边要隐藏着的，就是它的display = none）。

位置的话，就好比你想要点击登陆按钮然后就显示出来（就直接在登陆按钮的点击事件中加上b.style.display = “block”;就ok了），然后想要在登陆进去后的那个页面马上又消失掉（这个也直接在登陆的那段函数后面加上b.style.display = “block”;即可，意思就是执行完这段代码然后就让它的样式为隐藏状态）。

核心的写法就是显示与隐藏的事件

最后我就分享一下我自用的一个加载样式吧（天黑请闭眼）

因css代码有点而貌似又不能直接放文件链接在Word，所以就只放一下效果图哈（其实代码就是上面的那些，只不过没把样式的代码放上去和剪掉了一些源代码而已，所以上面的源代码只是用来参照一下id的哈），当然，有需要代码的老友记可以联系我?

我这个不错吧（不接受反驳哈）？有缩放动画与颜色的变化喔！