页面点击特效

<script src="js/jquery.js"></script>
<div class="changeColor" style="height:500px">
    <h1 style="text-align:center">啦啦啦啦啦啦</h1>
</div>
<style type="text/css">

/*滚动文字样式*/
#container
{
    position: relative;
    width: 200px;
}
/*滚动文字样式*/
#content
{
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap; /*重要，不然文字显示效果不好*/
}

</style>
<script language="javascript" type="text/javascript">
    //文字滚动
    (function ($) {
        $.fn.extend({
            roll: function (options) {
                var defaults = {
                    speed: 1
                };
                var options = $.extend(defaults, options);
                var speed = (document.all) ? options.speed : Math.max(1, options.speed - 1);
                if ($(this) == null) return;
                var $container = $(this);
                var $content = $("#content");
                var init_left = $container.width();
                $content.css({ left: parseInt(init_left) + "px" });
                var This = this;
                var time = setInterval(function () { This.move($container, $content, speed); }, 20); //setInterval会改变this指向，即使加了This=this，也要用匿名函数封装，这里调试了n久

                $container.bind("mouseover", function () {
                    clearInterval(time);
                });
                $container.bind("mouseout", function () {
                    time = setInterval(function () { This.move($container, $content, speed); }, 20);
                });

                return this;
            },
            move: function ($container, $content, speed) {
                var container_width = $container.width();
                var content_width = $content.width();
                if (parseInt($content.css("left")) + content_width > 0) {
                    $content.css({ left: parseInt($content.css("left")) - speed + "px" });
                }
                else {
                    $content.css({ left: parseInt(container_width) + "px" });
                }
            }
        });
    })(jQuery);

    //百度统计
    var _hmt = _hmt || [];
    (function () {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?73487e564b753be0f0bab7547f04047d";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();

    //生成目录索引列表
    function GenerateContentList() {
        var jquery_h3_list = $('#cnblogs_post_body h3'); //博客园的正文的div的id为cnblogs_post_body，然后查找下面所有的h3
        if (jquery_h3_list.length > 0) {
            var content = '<a name="_labelTop"></a>'; //此处开始拼阅读目录
            content += '<div id="navCategory">';
            content += '<p style="font-size:18px"><b onclick="DivHide();" style="cursor:pointer;" title="点击隐藏目录，再次点击显示目录">阅读目录</b></p>';
            content += '<ul id="Catalog">';
            //循环所有的h3，然后在h3的前面添加回到顶部的功能。
            for (var i = 0; i < jquery_h3_list.length; i++) {
                var go_to_top = '<div style="text-align: right">';
                if (i > 0) {
                    go_to_top += '<a href="#_labelTop" style="color: Blue">回到顶部</a>';
                }
                go_to_top += '<a name="_label' + i + '"></a></div>';
                $(jquery_h3_list[i]).before(go_to_top);
                var li_content = '<li><a href="#_label' + i + '" style="color: Blue">' + $(jquery_h3_list[i]).text() + '</a></li>';
                content += li_content;
            }
            content += '</ul>';
            content += '</div>';
            if ($('#cnblogs_post_body').length != 0) {
                $($('#cnblogs_post_body')[0]).prepend(content);
            }
        }
    }
    function DivHide() {
        if ($("#Catalog").css("display") == "none") {
            $("#Catalog").show(200);
        } else {
            $("#Catalog").hide(200);
        }
    }
    GenerateContentList();

    //文字颜色
    var ColorTimer;
    var Colorforn = 0;
    //颜色代码
    var ColorArray = new Array("#00CCCC", "#6699CC", "#669999", "#FFCC66", "#FF6666");
    ShowColor();
    function ShowColor() {
        //引用b_project class的文字会变色。
        $(".changeColor").css("color", "" + ColorArray[Colorforn] + "");
        Colorforn++;
        if (Colorforn >= ColorArray.length) Colorforn = 0;
        ColorTimer = setTimeout("ShowColor();", 500);
    }
    //文字颜色结束

    //滚动文字
    $(window).load(function () {
        $("#container").roll({ speed: 2 });
    });
    //滚动文字结束

    //单击显示随机文字
    var a_idx = 0;
    jQuery(document).ready(function ($) {
        $("body").click(function (e) {
            var a = new Array("路见不平一声吼，吼完继续往前走。", "咸鱼翻身，还是咸鱼。", "水能载舟，亦能煮粥！", "明月几时有，抬头自己瞅。", "天哪！我的衣服又瘦了。", "听君一席话，回家烤白薯。", "流氓不可怕，就怕流氓有文化。", "知识就像内裤，看不见但很重要。", "为了祖国下一代，再丑也得谈恋爱。", "穷玩车，富玩表，牛B加班敲电脑。", "英雄不问出路，流氓不看岁数。", "我们的目标：向钱看，向厚赚。", "帅有个屁用！到头来还不是被卒吃掉！");
            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": 5,
                "top": y - 20,
                "left": x,
                "position": "absolute",
                "font-weight": "bold",
                "color": "#FF69B4"
            });
            $("body").append($i);
            $i.animate({
                "top": y - 180,
                "opacity": 0
            },
                3000,
                function () {
                    $i.remove();
                });
        });
        setTimeout('delay()', 2000);
    });

    function delay() {
        $(".buryit").removeAttr("onclick");
    }

</script>