jpss

导航

统计

一句js将博客园文章转成手机/kindle易于阅读样式

背景

每天上下班在地铁中很无聊, 喜欢用手机看一些技术文档, 但大多技术网站的手机版样式惨不忍睹, 有些版式错乱,有些配色不协调.

将网页另存为pdf是一个方法, 但放在手机上阅读字体小, 放大后需要横向来回滚动, 体验不佳.

解决思路

  1. Chrome的打印功能可以直接将网页另存为pdf, 手机/pad/kindle都支持, 文件格式问题解决;
  2. 将页面多余元素去掉, 调整文章的宽度, 并放大字号, 调整适合手机阅读尺寸, 这点使用js解决.

步骤:

  1. 打开文章, 如http://www.cnblogs.com/jpss/p/3931558.html;
  2. F12打开开发者工具, 在控制台执行如下代码:
var el=$('.post'); $("*").not(el.find('*')).hide(); el.parents().andSelf().css({width:480,padding:0,margin:0,border:'none',float:'none',position:'static'}).show().find('img').css({maxWidth:470,height:'auto'}); $('body').css({background:'#fff',zoom:2.3});
  1. Ctrl-P调出打印工具, 打印目标选择另存为pdf, 保存到文件即可.

效果图如下:

alt 保存为pdf示意图

PS: 可以根据设备屏幕大小或分辨率适当调整width和zoom值.

posted on   jpss  阅读(4791)  评论(29编辑  收藏  举报

编辑推荐:
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· .NET Core 托管堆内存泄露/CPU异常的常见思路
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· NetPad:一个.NET开源、跨平台的C#编辑器
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
点击右上角即可分享
微信分享提示