《微信读书》自定义样式

最新推荐文章于 2023-04-10 16:09:47 发布

JackieZhengChina

最新推荐文章于 2023-04-10 16:09:47 发布

阅读量3.5k

点赞数 2

分类专栏：布局排版前端文章标签： css

本文链接：https://blog.csdn.net/admans/article/details/104045562

版权

前端同时被 3 个专栏收录

97 篇文章 6 订阅

订阅专栏

布局

9 篇文章 1 订阅

订阅专栏

排版

3 篇文章 0 订阅

订阅专栏

一直用微信读书看书，但是微信读书的Web版的布局不太喜欢。

重写下它的样式再加上单击关闭工具栏，这样看着舒服多了^_^：

/*浮动工具栏*/
document.getElementsByClassName("readerControls")[0].style.left="0";
document.getElementsByClassName("readerControls")[0].style.marginLeft="20px";
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML=".readerControls_fontSize,.readerControls_item{background-color: #3e5b94ba !important;}";
document.getElementsByTagName('HEAD').item(0).appendChild(style);

/*正文容器*/
document.getElementsByClassName("app_content")[0].style.width="100%";
document.getElementsByClassName("app_content")[0].style.maxWidth="100%";

document.getElementsByClassName("readerChapterContent")[0].style.paddingTop="0px";


/*顶部工具栏*/
document.getElementsByClassName("readerTopBar")[0].style.width="100%";
document.getElementsByClassName("readerTopBar")[0].style.maxWidth="100%";
document.getElementsByClassName("readerTopBar")[0].style.left="0";

/*笔记*/
document.getElementsByClassName("readerNotePanel")[0].style.left="20%";
document.getElementsByClassName("readerNotePanel")[0].style.width="60%";
document.getElementsByClassName("readerNotePanel")[0].style.margin="0 auto";

/*目录*/
document.getElementsByClassName("readerCatalog")[0].style.left="20%";
document.getElementsByClassName("readerCatalog")[0].style.width="60%";
document.getElementsByClassName("readerCatalog")[0].style.margin="0 auto";

/*正文*/
document.getElementsByClassName("renderTargetContainer")[0].style.margin="0 40px";
document.onclick=function(){
	if(document.getElementsByClassName("readerTopBar")[0].style.display=='none')
    {
		document.getElementsByClassName("readerTopBar")[0].style.display='flex';
		//document.getElementsByClassName("readerControls")[0].style.display='flex';			
	}
	else
    {
		document.getElementsByClassName("readerTopBar")[0].style.display='none';
		//document.getElementsByClassName("readerControls")[0].style.display='none';	
	}
}

暴力猴插件地址：

https://greasyfork.org/zh-CN/scripts/395641-%E5%BE%AE%E4%BF%A1%E8%AF%BB%E4%B9%A6%E9%98%85%E8%AF%BB%E6%A0%B7%E5%BC%8F

https://github.com/JackieZheng/WeReadStyle