Typecho 网站美化 自定义右键

    133

简单来说就是花里胡哨,没别的意思,看着喜欢就拿去

依次进入控制台 ; 外观; 设置外观 ; 主题自定义扩展,将以下代码加入到自定义 HTML 元素拓展 ; 在 body 标签结束前,部分内容自行修改即可。

<!--  自定义右键 -->
<style>
    a {
        text-decoration: none;
    }
    .usercm {
        background-color: #fff;
        font-size: 13px !important;
        width: 130px;
        box-shadow: 0 0 15px #333;
        position: absolute;
        display: none;
        z-index: 10000;
        opacity: 0.9;
        border-radius: 5px;
    }
    .usercm ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
    .usercm ul li {
        line-height: 35px;
    }
    .usercm ul li a {
        color: #666;
        padding: 0 15px;
        display: block;
    }
    .usercm ul li a:hover {
        color: #fff;
        background: rgba(9, 145, 113, 0.88);
        border-radius: 5px;
    }
    a.disabled {
        color: #c8c8c8 !important;
        cursor: not-allowed;
    }
</style>

<div class="usercm" style="left: 199px; top: 5px; display: none;">
    <ul>
        <li><a href="https://jun.cx/"><i class="fa fa-home fa-fw"></i><span> 首页</span></a></li>
        <li><a href="javascript:void(0);" onclick="copySelection();"><i class="fa fa-file fa-fw"></i><span> 复制</span></a></li>
        <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span> 前进</span></a></li>
        <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span> 后退</span></a></li>
        <li style="border-bottom: 1px solid gray;"><a href="javascript:location.reload();"><i class="fa fa-refresh fa-fw"></i><span> 刷新</span></a></li>
        <li><a href="https://jun.cx/category/shuoshuo/"><i class="fa fa-user fa-fw"></i><span> 说说</span></a></li>
        <li><a href="https://www.yeluzz.com/"><i class="fa fa-pencil fa-fw"></i><span> 野路子</span></a></li>
    </ul>
</div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    (function($) {
        $.fn.mouseMoveShow = function(menu) {
            $(window).mousemove(function(e) {
                const width = $(window).width();
                const height = $(window).height();
                let left = e.pageX;
                let top = e.pageY;

                if (left + $(menu).width() >= width) {
                    left -= $(menu).width() + 5;
                }
                if (top + $(menu).height() >= height) {
                    top -= $(menu).height() + 5;
                }

                $(document).on({
                    contextmenu: function(event) {
                        if (event.which === 3) {
                            $(menu).css({ left: left, top: top }).show();
                            return false;
                        }
                    },
                    click: function() {
                        $(menu).hide();
                    }
                });
            });
        };

        $.fn.disabledContextMenu = function() {
            window.oncontextmenu = function() {
                return false;
            };
        };
    })(jQuery);

    function copySelection() {
        const selection = window.getSelection().toString();
        if (selection) {
            document.execCommand("copy");
            alert("内容已复制!");
        } else {
            alert("请选择需要复制的内容!");
        }
    }

    $(function() {
        const userAgent = navigator.userAgent;
        const mobileDevices = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";");
        let isMobile = false;

        for (let device of mobileDevices) {
            if (userAgent.indexOf(device) > -1) {
                isMobile = true;
                break;
            }
        }

        if (!isMobile) {
            $(".usercm").mouseMoveShow(".usercm");
            $.fn.disabledContextMenu();
        }
    });
</script>

 

消息盒子
# 您需要首次评论以获取消息 #
# 您需要首次评论以获取消息 #

只显示最新 10 条未读和已读信息

<谷歌代码>