zoukankan      html  css  js  c++  java
  • 给博客添加一个浮动小人

    加载这个脚本需要 jQuery库 的支持,所以想要成功添加 浮动小人 ,要先确认你的网站已加载 jQuery库

    • 将以下 CSS 代码加入到你的 style.css 文件中
    .spig {
    	display: block;
    	 130px;
    	height: 170px;
    	position: absolute;
    	bottom: 300px;
    	left: 160px;
    	z-index: 9999;
    }
    #message {
    	line-height:170%;
    	color: #191919;
    	border: 1px solid #c4c4c4;
    	background: #ddd;
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	border-radius: 5px;
    	min-height: 1em;
    	padding: 5px;
    	top: -45px;
    	position: absolute;
    	text-align: center;
    	 auto !important;
    	z-index: 10000;
    	-moz-box-shadow: 0 0 15px #eeeeee;
    	-webkit-box-shadow: 0 0 15px #eeeeee;
    	border-color: #eeeeee;
    	box-shadow: 0 0 15px #eeeeee;
    	outline: none;
    }
    .mumu {
    	 130px;
    	height: 170px;
    	cursor: move;
    	background: url(“这里是浮动小人的图片链接”) no-repeat;
    } 
    

      

    • 然后在 body 中添加如下代码(footer或者header都可以)
    <script type="text/javascript "> 
        <?php if(is_home()) echo 'var isindex=true;var title="";';else echo 'var isindex=false;var title="',  get_the_title(),'";'; ?> 
        <?php if((($display_name = wp_get_current_user()->display_name) != null)) echo 'var visitor="',$display_name,'";'; else if(isset($_COOKIE['comment_author_'.COOKIEHASH])) echo 'var visitor="',$_COOKIE['comment_author_'.COOKIEHASH],'";';else echo 'var visitor="游客";';echo "
    "; ?> 
        </script> 
        <script type="text/javascript" src="这里填写spig.js的链接路径" charset="gb2312"></script> 
        <div id="spig" class="spig">
            <div id="message">加载中……</div> 
            <div id="mumu" class="mumu"></div> 
        </div> 
        <!--.end spig--> 
        <span class="hitokoto" id="hitokoto" style="display:none">Loading...</span> 
           <div id="hjsbox" style="display:none"> 
            </div> 
    <script>
    setTimeout("getkoto()",1000); 
                var t; 
                function getkoto(){ 
                    var hjs = document.createElement('script'); 
                    hjs.setAttribute('id', 'hjs'); 
                    hjs.setAttribute('src', 'https://api.lwl12.com/hitokoto/main/get?encode=json'); 
                    document.getElementById("hjsbox").appendChild(hjs); 
                    t=setTimeout("getkoto()",2000); 
                } 
                function echokoto(result){ 
                    var hc = eval(result); 
                    //$("#hitokoto").fadeTo(300,0); 
                    document.getElementById("hitokoto").innerHTML = hc.hitokoto; 
                    //$("#hitokoto").fadeTo(300,0.75); 
                }
    </script>
    
    •  然后,上传 spig.js 文件,修改上面代码中的 两处路径 就可以啦~
    jQuery(document).ready(function($) {
        $("#spig").mousedown(function(e) {
            if (e.which == 3) {
                showMessage("秘密通道:<br /> <a href="" title="首页">首页</a>    <a href="" title="订阅">订阅</a> <a href="" title="留言">留言</a>", 10000);
            }
        });
        $("#spig").bind("contextmenu",
        function(e) {
            return false;
        });
    });
    
    jQuery(document).ready(function($) {
        $("#message").hover(function() {
            $("#message").fadeTo("100", 1);
        });
    });
    
    jQuery(document).ready(function($) {
        //$(".mumu").jrumble({rangeX: 2,rangeY: 2,rangeRot: 1});
        $(".mumu").mouseover(function() {
            $(".mumu").fadeTo("300", 0.3);
            msgs = ["我隐身了,你看不到我", "我会隐身哦!嘿嘿!", "别动手动脚的,把手拿开!", "把手拿开我才出来!"];
            var i = Math.floor(Math.random() * msgs.length);
            showMessage(msgs[i]);
        });
        $(".mumu").mouseout(function() {
            $(".mumu").fadeTo("300", 1)
        });
    });
    
    jQuery(document).ready(function($) {
        if (isindex) { //如果是主页
            var now = (new Date()).getHours();
            if (now > 0 && now <= 6) {
                showMessage(visitor + ' 你是夜猫子呀?还不睡觉,明天起的来么你?', 6000);
            } else if (now > 6 && now <= 11) {
                showMessage(visitor + ' 早上好,早起的鸟儿有虫吃噢!早起的虫儿被鸟吃,你是鸟儿还是虫儿?嘻嘻!', 6000);
            } else if (now > 11 && now <= 14) {
                showMessage(visitor + ' 中午了,吃饭了么?不要饿着了,饿死了谁来挺我呀!', 6000);
            } else if (now > 14 && now <= 18) {
                showMessage(visitor + ' 中午的时光真难熬!还好有你在!', 6000);
            } else {
                showMessage(visitor + ' 快来逗我玩吧!', 6000);
            }
        } else {
            showMessage('欢迎' + visitor + '来到《若是凉夜已成梦》阅读 ' + title + ' ', 6000);
        }
        $(".spig").animate({
            top: $(".spig").offset().top + 300,
            left: document.body.offsetWidth - 160
        },
        {
            queue: false,
            duration: 1000
        });
    });
    
    jQuery(document).ready(function($) {
        $('h2 a').click(function() { //标题被点击时
            showMessage('正在用吃奶的劲加载《<span style="color:#0099cc;">' + $(this).text() + '</span>》请稍候');
        });
        $('h2 a').mouseover(function() {
            showMessage('要看看《<span style="color:#0099cc;">' + $(this).text() + '</span>》这篇文章么?');
        });
        $('#prev-page').mouseover(function() {
            showMessage('要翻到上一页吗?');
        });
        $('#next-page').mouseover(function() {
            showMessage('要翻到下一页吗?');
        });
        $('#index-links li a').mouseover(function() {
            showMessage('去 <span style="color:#0099cc;">' + $(this).text() + '</span> 逛逛');
        });
        $('.comments').mouseover(function() {
            showMessage('<span style="color:#0099cc;">' + visitor + '</span> 向评论栏出发吧!');
        });
        $('#submit').mouseover(function() {
            showMessage('确认提交了么?');
        });
        $('#s').focus(function() {
            showMessage('输入你想搜索的关键词再按Enter(回车)键就可以搜索啦!');
        });
        $('#go-prev').mouseover(function() {
            showMessage('点它可以后退哦!');
        });
        $('#go-next').mouseover(function() {
            showMessage('点它可以前进哦!');
        });
        $('#refresh').mouseover(function() {
            showMessage('点它可以重新载入此页哦!');
        });
        $('#go-home').mouseover(function() {
            showMessage('点它就可以回到首页啦!');
        });
        $('#addfav').mouseover(function() {
            showMessage('点它可以把此页加入书签哦!');
        });
        $('#nav-two a').mouseover(function() {
            showMessage('嘘,从这里可以进入控制面板的哦!');
        });
        $('.post-category a').mouseover(function() {
            showMessage('点击查看此分类下得所有文章');
        });
        $('.post-heat a').mouseover(function() {
            showMessage('点它可以直接跳到评论列表处.');
        });
        $('#tho-shareto span a').mouseover(function() {
            showMessage('你知道吗?点它可以分享本文到' + $(this).attr('title'));
        });
        $('#switch-to-wap').mouseover(function() {
            showMessage('点击可以切换到手机版博客版面');
        });
    });
    
    jQuery(document).ready(function($) {
    
        window.setInterval(function() {
            msgs = [$("#hitokoto").text(), weather.c[0], weather.c[2], weather.c[5], weather.c[7]];
            var i = Math.floor(Math.random() * msgs.length);
            showMessage(msgs[i], 10000);
        },
        35000);
    });
    
    jQuery(document).ready(function($) {
        window.setInterval(function() {
            msgs = [$("#hitokoto").text()];
            //if(weather.state)msgs.concat(weather.c);
            var i = Math.floor(Math.random() * msgs.length);
            s = [0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.75, -0.1, -0.2, -0.3, -0.4, -0.5, -0.6, -0.7, -0.75];
            var i1 = Math.floor(Math.random() * s.length);
            var i2 = Math.floor(Math.random() * s.length);
            $(".spig").animate({
                left: document.body.offsetWidth / 2 * (1 + s[i1]),
                top: document.body.offsetheight / 2 * (1 + s[i1])
            },
            {
                duration: 2000,
                complete: showMessage(msgs[i])
            });
        },
        45000);
    });
    
    jQuery(document).ready(function($) {
        $("#author").click(function() {
            showMessage("留下你的尊姓大名!");
            $(".spig").animate({
                top: $("#author").offset().top - 70,
                left: $("#author").offset().left - 170
            },
            {
                queue: false,
                duration: 1000
            });
        });
        $("#email").click(function() {
            showMessage("留下你的邮箱,不然就是无头像人士了!");
            $(".spig").animate({
                top: $("#email").offset().top - 70,
                left: $("#email").offset().left - 170
            },
            {
                queue: false,
                duration: 1000
            });
        });
        $("#url").click(function() {
    
            showMessage("快快告诉我你的家在哪里,好让我去参观参观!");
            $(".spig").animate({
                top: $("#url").offset().top - 70,
                left: $("#url").offset().left - 170
            },
            {
                queue: false,
                duration: 1000
            });
        });
        $("#comment").click(function() {
            showMessage("认真填写哦!不然会被认作垃圾评论的!我的乖乖~");
            $(".spig").animate({
                top: $("#comment").offset().top - 70,
                left: $("#comment").offset().left - 170
            },
            {
                queue: false,
                duration: 1000
            });
        });
    });
    
    var spig_top = 50;
    jQuery(document).ready(function($) {
        var f = $(".spig").offset().top;
        $(window).scroll(function() {
            $(".spig").animate({
                top: $(window).scrollTop() + f + 300
            },
            {
                queue: false,
                duration: 1000
            });
        });
    });
    
    jQuery(document).ready(function($) {
        var stat_click = 0;
        $(".mumu").click(function() {
            if (!ismove) {
                stat_click++;
                if (stat_click <= 4) {
                    msgs = [weather.c[0], weather.c[2], weather.c[5], weather.c[7]];
                } else if (stat_click > 4) {
                    msgs = ["你有完没完呀?", "你已经摸我" + stat_click + "次了", "非礼呀!救命!OH,My ladygaga"];
                    var i = Math.floor(Math.random() * msgs.length);
                    //showMessage(msgs[i]);
                } else {
                    msgs = ["筋斗云!~我飞!", "我跑呀跑呀跑!~~", "别摸我,大男人,有什么好摸的!", "惹不起你,我还躲不起你么?", "不要摸我了,我会告诉老婆来打你的!", "干嘛动我呀!小心我咬你!"];
                    var i = Math.floor(Math.random() * msgs.length);
                    //showMessage(msgs[i]);
                }
                s = [0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.75, -0.1, -0.2, -0.3, -0.4, -0.5, -0.6, -0.7, -0.75];
                var i1 = Math.floor(Math.random() * s.length);
                var i2 = Math.floor(Math.random() * s.length);
                $(".spig").animate({
                    left: document.body.offsetWidth / 2 * (1 + s[i1]),
                    top: document.body.offsetheight / 2 * (1 + s[i1])
                },
                {
                    duration: 500,
                    complete: showMessage(msgs[i])
                });
            } else {
                ismove = false;
            }
        });
    });
    
    
    function showMessage(a, b) {
        if (b == null) b = 10000;
        jQuery("#message").hide().stop();
        jQuery("#message").html(a);
        jQuery("#message").fadeIn();
        jQuery("#message").fadeTo("1", 1);
        jQuery("#message").fadeOut(b);
    };
    
    var _move = false;
    var ismove = false; //移动标记
    var _x, _y; //鼠标离控件左上角的相对位置
    jQuery(document).ready(function($) {
        $("#spig").mousedown(function(e) {
            _move = true;
            _x = e.pageX - parseInt($("#spig").css("left"));
            _y = e.pageY - parseInt($("#spig").css("top"));
        });
        $(document).mousemove(function(e) {
            if (_move) {
                var x = e.pageX - _x;
                var y = e.pageY - _y;
                var wx = $(window).width() - $('#spig').width();
                var dy = $(document).height() - $('#spig').height();
                if (x >= 0 && x <= wx && y > 0 && y <= dy) {
                    $("#spig").css({
                        top: y,
                        left: x
                    }); //控件新位置
                    ismove = true;
                }
            }
        }).mouseup(function() {
            _move = false;
        });
    });
    
    function getCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length)
        }
        return null;
    }
    function setCookie(name, value, days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
            var expires = "; expires=" + date.toGMTString()
        } else var expires = "";
        document.cookie = name + "=" + value + expires + "; path=/"
    }
    var weather = Array();
    weather.s = false;
    jQuery(document).ready(function($) {
        var date = new Date();
        weather.d = "" + date.getFullYear() + date.getMonth() + date.getDay();
        weather.ck = getCookie("weather");
        if (weather.ck == null || weather.d != getCookie("wea_tstamp")) {
            $.ajax({
                dataType: "jsonp",
                success: function(data) {
                    if (data.success != 1) {
                        return;
                    }
                    weather.s = true;
                    weather.c = Array();
                    weather.c[0] = "今天是" + data.result[0].days + "," + data.result[0].week;
                    weather.c[1] = data.result[0].citynm + "今天" + data.result[0].temp_high + "°C到" + data.result[0].temp_low + "°C";
                    weather.c[2] = data.result[0].citynm + "今天" + data.result[0].weather;
                    weather.c[3] = data.result[0].citynm + "今天" + data.result[0].winp + "," + data.result[0].wind;
                    weather.c[4] = data.result[0].citynm + "明天" + data.result[1].temp_high + "°C到" + data.result[1].temp_low + "°C";
                    weather.c[5] = data.result[0].citynm + "明天" + data.result[1].weather;
                    weather.c[6] = data.result[0].citynm + "后天" + data.result[2].temp_high + "°C到" + data.result[2].temp_low + "°C";
                    weather.c[7] = data.result[0].citynm + "后天" + data.result[2].weather;
                    setCookie("wea_tstamp", weather.d, 1);
                    setCookie("weather", encodeURI(weather.c.join(",")), 1);
                },
                type: "GET",
                url: "https://myhloliapi.sinaapp.com/weather/?callback=?"
            });
        } else {
            weather.s = true;
            weather.c = decodeURI(weather.ck).split(",");
        }
    });
    

      

  • 相关阅读:
    171 01 Android 零基础入门 03 Java常用工具类02 Java包装类 01 包装类简介 01 Java包装类内容简介
    170 01 Android 零基础入门 03 Java常用工具类01 Java异常 08 Java异常总结 01 异常总结
    169 01 Android 零基础入门 03 Java常用工具类01 Java异常 07 异常链 01 异常链简介
    168 01 Android 零基础入门 03 Java常用工具类01 Java异常 06 自定义异常 01 自定义异常类
    167 01 Android 零基础入门 03 Java常用工具类01 Java异常 05 使用throw和throws实现异常处理 02 使用throw抛出异常对象
    166 01 Android 零基础入门 03 Java常用工具类01 Java异常 05 使用throw和throws实现异常处理 01 使用throws声明异常类型
    165 01 Android 零基础入门 03 Java常用工具类01 Java异常 04 使用try…catch…finally实现异常处理 05 return关键字在异常处理中的使用
    DevExpress WPF v20.2版本亮点放送:全新升级的PDF Viewer
    界面控件DevExpress使用教程:Dashboard – 自定义导出
    DevExpress WinForms帮助文档:表单控件
  • 原文地址:https://www.cnblogs.com/Jansens520/p/10840113.html
Copyright © 2011-2022 走看看