jerryc127 / hexo-theme-butterfly

🦋 A Hexo Theme: Butterfly
https://butterfly.js.org
Apache License 2.0
7.1k stars 1.28k forks source link

[Bug]: 代码块高度限制在display: none时失效 #1504

Closed windshadow233 closed 4 months ago

windshadow233 commented 4 months ago

使用的 Butterfly 版本? | What version of Butterfly are you use?

4.14.0-b1

是否修改过主题文件? || Has the theme files been modified?

是 (Yes)

使用的瀏覽器? || What browse are you using?

Chrome

使用的系統? || What operating system are you using?

macOS

依賴插件 | Package dependencies Information

hexo-site@0.0.0 /Users/wind/Documents/JSProjects/blog
├── @aptuitiv/gulp-clean-css@4.4.3
├── del@6.1.1
├── fs-extra@11.2.0
├── gulp-html-minifier-terser@7.1.0
├── gulp-imagemin@6.2.0
├── gulp-rev-all@3.0.0
├── gulp-uglify-es@3.0.0
├── gulp@5.0.0
├── hexo-blog-encrypt@3.1.9
├── hexo-butterfly-wowjs@1.0.5
├── hexo-deployer-rsync@3.0.0
├── hexo-generator-archive@2.0.0
├── hexo-generator-category@2.0.0
├── hexo-generator-feed@3.0.0
├── hexo-generator-index@3.0.0
├── hexo-generator-search@2.4.3
├── hexo-generator-sitemap@3.0.1
├── hexo-generator-tag@2.0.0
├── hexo-renderer-kramed@0.1.4
├── hexo-renderer-pug@3.0.0
├── hexo-renderer-stylus@3.0.1
├── hexo-server@3.0.0
├── hexo-theme-landscape@1.0.0
├── hexo-wordcount@6.0.1
├── hexo@7.1.1
└── social-share.js@1.0.16

問題描述 | Describe the bug

如题,如果一个代码块在网页载入时处于display: none的不可见状态(例如在非默认的tab下时等),则代码块的渲染代码createEle中的: if (highlightHeightLimit && item.offsetHeight > highlightHeightLimit + 30) { 这句代码,item.offsetHeight值为0导致不会为代码块添加展开按钮。

由于不是很懂前端,暂时用jQuery Actual解决了。

微不足道的小问题罢了~很不错的主题,感谢作者!

出現問題網站 | Website

https://blog.fyz666.xyz/blog/11354/

jerryc127 commented 4 months ago

https://butterfly.js.org/posts/4aa8abbe/#代碼高度限制

文档已经说了 不適用於隱藏後的代碼塊( css 設置 display: none)

windshadow233 commented 4 months ago

哈哈哈,是我的鍋,沒仔細看文檔。不過正常來說隱藏後的代碼塊也適用高度限製或許比較合理?

jerryc127 commented 4 months ago

歡迎 pr