给你的网站添加“富强民主”点击特效

玩网站也有一年多了，之前的满腔热血研究到深夜的日子也一去不复返了，一方面是折腾多了也腻歪，另一方面目前已经脱离校园开始漫长的打工之路，打理网站的时间可谓是越来越少，目前非常勉强保持着每日更新频率，更新方面大不如前大家就多多体谅了。最近有很多建站的朋友问我一些网站特效，由于工作原因不能及时的回复，这里趁着难得的周末附上站内一直在使用的鼠标点击特效，代码不多部署也是非常的简单，又是废话一堆这里直接上硬菜吧！

富强明主点击特效：

演示效果：

代码部分：

<script type="text/javascript">  
    var a_idx = 0;  
    jQuery(document).ready(function($) {  
        $("body").click(function(e) {  
            var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");  
            var $i = $("<span/>").text(a[a_idx]);  
            a_idx = (a_idx + 1) % a.length;  
            var x = e.pageX,  
            y = e.pageY;  
            $i.css({  
                "z-index": 9999999999999999999999999999999999999999,  
                "top": y - 20,  
                "left": x,  
                "position": "absolute",  
                "font-weight": "bold",  
                "color": "#ff6651"  
            });  
            $("body").append($i);  
            $i.animate({  
                "top": y - 180,  
                "opacity": 0  
            },  
            1500,  
            function() {  
                $i.remove();  
            });  
        });  
    });  
    </script>

数字点击特效：

演示效果：

代码部分：

<script>  
    jQuery(document).ready(function($) {  
    var _click_count=0;  
    $("body").bind("click",function(e){ //直接给body一个事件好了.  
    var n=Math.round(Math.random()*100);//随机数  
   // var $i=$("<b>").text("+"+(++_click_count));//添加到页面的元素  
     var $i=$("<b>").text("+"+(++n));//添加到页面的元素  
    var x=e.pageX,y=e.pageY;//鼠标点击的位置  
    $i.css({  
    "z-index":99999,  
    "top":y-15,  
    "left":x,  
    "position":"absolute",  
    "color":"red"  
    });  
    $("body").append($i);  
    $i.animate(  
    {"top":y-180,"opacity":0},  
    1500,  
    function(){$i.remove();}  
    );  
    e.stopPropagation();  
    });  
    });  
    </script>

代码部署教程：

部署到自己的网站非常的简单，几乎是支持所有的站点，一般情况下只要将复制好的代码粘贴到</body>之前就行了。如果是WordPress网站直接添加到footer.php文件的</body>之前就OK了。代码中的字体以及属性均可以自定义设置，因为上面附上另种不同效果的代码，大家选一个喜欢的给自己的网站装饰下看看效果吧！如果添加后未生效请尝试清理CDN缓存或者浏览器缓存就可以了。

感谢您的来访，获取更多精彩文章请收藏本站。