☰

EasyCSDN

这是一款促进CSDN极致简洁和高效的插件。免费共享大量创新功能，如：净化页面、展示全屏、临时显示推荐等。让我们的学习体验无比简洁、专注、高效、畅快。

当前为 2023-11-25 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         EasyCSDN
  3. // @description  这是一款促进CSDN极致简洁和高效的插件。免费共享大量创新功能，如：净化页面、展示全屏、临时显示推荐等。让我们的学习体验无比简洁、专注、高效、畅快。
  4. // @version      11.2
  5. // @author       xcanwin
  6. // @namespace    https://github.com/xcanwin/EasyCSDN/
  7. // @supportURL   https://github.com/xcanwin/EasyCSDN/
  8. // @license      GPL-2.0-only
  9. // @match        *://blog.csdn.net/*/article/details/*
  10. // @match        *://*.blog.csdn.net/article/details/*
  11. // @grant        GM_addStyle
  12. // @run-at       document-start
  13. // ==/UserScript==
  14.  
  15. (function() {
  16.     'use strict';
  17.  
  18.     const $ = (Selector, el) => (el || document).querySelector(Selector);
  19.     const $$ = (Selector, el) => (el || document).querySelectorAll(Selector);
  20.  
  21.     /*电脑端净化样式*/
  22.     const purify_style_pc = `
  23. .passport-login-container /*隐藏[置顶的]登录提示*/,
  24. .passport-login-tip-container /*隐藏[置顶的]登录权益提示*/,
  25. body>#toolbarBox /*隐藏[置顶的][顶部的]菜单栏*/,
  26. .left-toolbox /*隐藏[置顶的][底部的]关注栏*/,
  27. .blog_container_aside /*隐藏[左边的]栏*/,
  28. #rightAside /*隐藏[右边的]栏*/,
  29. .csdn-side-toolbar /*隐藏[右边的]磁吸栏*/,
  30. .blog-footer-bottom /*隐藏[底部的]网站介绍*/,
  31. .recommend-nps-box /*隐藏[底部的]打分*/,
  32. .blog-tags-box /*隐藏[正文的][顶部的]分类*/,
  33. #blogColumnPayAdvert /*隐藏[正文的][顶部的]专栏*/,
  34. .more-toolbox-new /*隐藏[正文的][底部的]关注栏*/,
  35. #treeSkill /*隐藏[正文的][底部的]技能树*/,
  36. .recommend-box /*隐藏[正文的][底部的]推荐文章*/,
  37. code .hljs-button /*隐藏[正文的][代码块的]复制提示*/,
  38. .article-search-tip /*隐藏[正文的]搜索提示*/
  39. {
  40.     display: none !important;
  41. }
  42.  
  43. /*隐藏背景*/
  44. body {
  45.     background: none !important;
  46.     background-image: unset !important;
  47.     background-color: #ffebeb !important;
  48. }
  49.  
  50. /*正文居中*/
  51. #mainBox {
  52.     display: flex;
  53.     justify-content: center;
  54. }
  55.  
  56. /*展示全屏*/
  57. #mainBox, #mainBox main {
  58.     width: 100%;
  59.     margin-bottom: unset !important;
  60. }
  61. .main_father {
  62.     padding: unset !important;
  63. }
  64. .main_father.d-flex {
  65.     display: unset !important;
  66. }
  67.  
  68. /*展示分界线*/
  69. main .blog-content-box {
  70.     margin-bottom: 64px !important;
  71. }
  72.  
  73. /*临时显示*/
  74. .show-temp {
  75.     display: unset !important;
  76. }
  77. `;
  78.  
  79.  
  80.     /*移动端净化样式*/
  81.     const purify_style_mb = `
  82. #csdn-toolbar /*隐藏[置顶的][顶部的]菜单栏*/,
  83. #operate /*隐藏[置顶的][底部的]搜索标签与评论*/,
  84. .aside-header-fixed /*隐藏[顶部的]关注*/
  85. {
  86.     display: none !important;
  87. }
  88.  
  89. /*展示全屏*/
  90. body #main {
  91.     padding-top: unset !important;
  92.     margin-top: unset !important;
  93. }
  94. body {
  95.     padding-bottom: unset !important;
  96. }
  97.  
  98. /*展示分界线*/
  99. .spec_space {
  100.     background-color: #ffebeb !important;
  101.     height: 32px !important;
  102. }
  103. `;
  104.  
  105.     //净化页面
  106.     const purifyPage = function() {
  107.         GM_addStyle(purify_style_pc);
  108.         GM_addStyle(purify_style_mb);
  109.     };
  110.  
  111.     //显示[正文的][底部的]推荐文章
  112.     const showRecommend = function() {
  113.         window.addEventListener('click', showRecommend.listen_click);
  114.     };
  115.  
  116.     //显示[正文的][底部的]推荐文章-事件监听
  117.     showRecommend.listen_click = function(event) {
  118.         const el_h = event.target.scrollHeight; //事件的目标元素的高度
  119.         const el_mouse_y = event.layerY; //事件的目标元素里面的鼠标y坐标
  120.         //判断分界线范围内
  121.         if (event.target === $("main") && el_h - 64 < el_mouse_y <= el_h) {
  122.             $$(".recommend-box").forEach(el => {
  123.                 el.classList.toggle("show-temp");
  124.             });
  125.             $(".recommend-box")?.scrollIntoView();
  126.         }
  127.     };
  128.  
  129.     purifyPage();
  130.     showRecommend();
  131.  
  132. })();