zoukankan      html  css  js  c++  java
  • 随笔-博客园美化

    猪宝店美化代码

    背景调整

    #页面定制CSS代码中:
    body {
        color: 	#000000;
        background:url(https://w.wallhaven.cc/full/l3/wallhaven-l392mr.jpg) fixed;
        background-position:center;
        background-size:cover;
        background-repeat: no-repeat;
        font-family: "微软雅黑" , "PTSans" , "Arial" ,sans-serif;
        font-size: 14px;
        min-height: 101%;
        opacity: 0.8;
    }
    

    禁止右键复制

    #页面定制CSS代码:
    html,body {
        moz-user-select: -moz-none;
        -moz-user-select: none;
        -o-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    

    添加背景人物

    #博客侧边栏公告:
    <script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.0.min.js"></script>
    <script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.min.js"></script>
    
    <script type="text/javascript">
    L2Dwidget.init({
          "display": {
            "superSample": 3,
            "width": 300,
            "height": 600,
            "position": "right",
            "hOffset": 50,
            "vOffset": -150
              },
    "model": {
                jsonPath: "https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json",
                "scale": 1
            }
         });
    </script>
    
    

    鼠标点击效果

    #页首HTML代码
    <script type="text/javascript">
    var a_idx = 0;
    jQuery(document).ready(function($) {
    $("body").click(function(e) {
    var a = new Array("❤可爱小宝❤","❤可爱大宝❤","❤猪宝店❤","❤❤❤","✰✰✰");
    var $i = $("<span></span>").text(a[a_idx]);
    a_idx = (a_idx + 1) % a.length;
    var x = e.pageX,
    y = e.pageY;
    $i.css({
    "z-index": 999999999999999999999999999999999999999999999999999999999999999,
    "top": y - 20,
    "left": x,
    "position": "absolute",
    "font-weight": "bold",
    "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
    });
    $("body").append($i);
    $i.animate({
    "top": y - 180,
    "opacity": 0
    },
    1500,
    function() {
    $i.remove();
    });
    });
    });
    </script>
    

    粒子吸附效果

    #页脚HTML代码
    <script id="c_n_script" 
    src="https://blog-static.cnblogs.com/files/xiaokang01/js.js"
    color="240,230,140" 
    opacity="2.0" 
    count="200" 
    zindex="-5">if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent))
    {
    }
    else
    {       }
    </script>
    

    五角星坠落效果

    #页脚HTML代码
    <script id="c_n_script" 
    <script type="text/javascript">
    (function($){
        $.fn.snow = function(options){
        var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('✰'),
        documentHeight     = $(document).height(),
        documentWidth    = $(document).width(),
        defaults = {
            minSize        : 5,
            maxSize        : 25,
            newOn        : 500,
            flakeColor    : getRandomColor() /* 此处可以定五角星颜色*/
        },
        options    = $.extend({}, defaults, options);
        var interval= setInterval( function(){
        var startPositionLeft = Math.random() * documentWidth - 100,
        startOpacity = 0.5 + Math.random(),
        sizeFlake = options.minSize + Math.random() * options.maxSize,
        endPositionTop = documentHeight - 200,
        endPositionLeft = startPositionLeft - 500 + Math.random() * 500,
        durationFall = documentHeight * 10 + Math.random() * 5000;
        $flake.clone().appendTo('body').css({
            left: startPositionLeft,
            opacity: startOpacity,
            'font-size': sizeFlake,
            color: getRandomColor()
        }).animate({
            top: endPositionTop,
            left: endPositionLeft,
            opacity: 0.2
        },durationFall,'linear',function(){
            $(this).remove()
        });
        }, options.newOn);
        };
    })(jQuery);
    $(function(){
        $.fn.snow({ 
            minSize: 10, /* 定义五角星最小尺寸 */
            maxSize: 100,/* 定义五角星最大尺寸 */
            newOn: 300 /* 定义密集程度,数字越小越密集 */
        });
    });
    var getRandomColor = function(){
      return '#'+Math.floor(Math.random()*16777215).toString(16); 
    }
    </script>
    

    点击爆炸效果

    #页首HTML代码:
    <script src="https://blog-static.cnblogs.com/files/xiongchao0823/cursor-effects.js"></script>
    
  • 相关阅读:
    Navicat连接mysql出现10061/10060错误的解决
    对话守则
    一次Django admin bug解决的思维过程
    Think different
    SVN版本库的迁移
    Windows Phone 8 锁屏背景与通知
    Windows Phone 7 应用升级 Windows phone 8 方案预览 选择合适的 Key Feature
    从 windows phone7 到 windows phone 8 更新 如何设配两个版本
    windows phone 8 语音 Speech for Windows Phone 8
    windows phone 8 中的应用间通信
  • 原文地址:https://www.cnblogs.com/XWJHY/p/14168424.html
Copyright © 2011-2022 走看看