微博插件-微博图片全显示（页面样式本人优化版）


//通过油猴插件安装，chrome系浏览器和Microsoft Edge通用// ==UserScript==// @name        微博图片全显示// @namespace   hzhbest// @include     Sina Visitor System// @include     Sina Visitor System// @include     Sina Visitor System// @include     Sina Visitor System// @description    同屏显示多图微博的全部大图。// @version     3.1// @grant       GM_xmlhttpRequest// @grant       unsafeWindow// @run-at         document-end// ==/UserScript==(function() {// Insert CSSvar headID = document.getElementsByTagName("head")[0];var cssNode0 = creaElemIn('style', headID);cssNode0.type = 'text/css';cssNode0.innerHTML = ' .WB_frame_c{font-size: 19px;line-height: 1.6em}body .WB_feed_v3 .WB_expand .WB_text{font-size: 20px;line-height: 1.6em}.WB_text{font-size: 20px;line-height: 1.6em}.W_f14{font-size: 20px;line-height: 1.6em}.repeat_list .list_box .WB_text{} ';var topheight = 10;var topspare = 50;// Sina Visitor System// Sina Visitor Systemvar regex = /weibo\.com\/\d{10}\/[a-z0-9A-Z]{9}\??/;// window.addEventListener('load', function(){if (regex.test(document.location.href)) {setTimeout(init, 3000);}}, false);if (regex.test(document.location.href)) init(); //console.log(regex.test(document.location.href));function init(){var list_ul = getElementsByClass("list_ul", 'div')[0];  //评论框架var expbox = getElementsByClass("WB_expand_media_box", 'div')[0];  //附加媒体容器if (!list_ul && !expbox){  //console.log("no1");//未加载评论框架，等候setTimeout(init, 1000);return;} else if (!!list_ul && !expbox) {  //console.log("no2");//评论框架已加载却无附加媒体容器，退出getlongtext()return;} else {//console.log("go");getlongtext()go();}}function go(){var wrpbox = getElem('//div[@node-type="feed_list_media_prev"]') || getElem('//div[@class="WB_detail"]/div[@class="WB_media_wrap clearfix"]');        //附加媒体容器var expbox = getElementsByClass("WB_expand_media_box", 'div')[0];  //扩展媒体容器var feedbox = getElementsByClass("WB_feed_handle", 'div')[0];//评论区分解元素var appbox = getElementsByClass("WB_app_view", 'div')[0];//应用容器var maintextimg = getElem('//div[@class="WB_detail"]/div[@class="WB_text W_f14"]/a[@imagecard]');   //正文中的图片var box = wrpbox.parentNode;//装载提取内容的容器var imgthumbs = wrpbox.getElementsByTagName('img');//提取其中的图片var imgsrc = [], imgs = [], imgl = imgthumbs.length, mtimg;var _limited = false;//console.log(maintextimg.attributes[0]);// Insert CSS//var headID = document.getElementsByTagName("head")[0];var cssNode = creaElemIn('style', headID);cssNode.type = 'text/css';cssNode.innerHTML = '.big_pic{max-width: 890px;} .big_pic_n{max-width: 500px;} ';  //大图样式cssNode.innerHTML += '.WB_frame_c {width: auto !important; max-width: 920px; min-width: 600px;} .WB_text.W_f14, .repeat_list .list_box .WB_text, .WB_expand>.WB_text{width: 490px;font-size: 20px;line-height: 1.6em;} .WB_frame_c .media_box{display: none !important;} div[node-type="comment_list"] .media_box{display: block !important;} div[id^="Pl_Core_RecommendFeed__"]{right: 150px; width: 100px !important; max-height: 35px; overflow: hidden; transition: all ease 0.2s 0.5s;} div[id^="Pl_Core_RecommendFeed__"]:hover{width: 300px !important; max-height: 1000px;} div[id^="Pl_Core_RecommendFeed__"] .opt_box{display:none;} div[id^="Pl_Core_RecommendFeed__"]:hover .opt_box{display: inline-block;}';  //微博自身框架样式cssNode.innerHTML += '.big_pic_sc,.big_pic_nc,.big_pic_1c,.big_pic_2c,.big_pic_3c{position: fixed; left:10px; height: 20px; padding: 3px; border: 1px solid white; color: white; background: rgba(133,133,133,0.6); cursor: pointer;} .big_pic_sc{top: 430px} .big_pic_nc{top: 500px;} .big_pic_1c{top: 300px;} .big_pic_2c{top: 340px;} .big_pic_3c{top: 380px;}';  //按钮样式var sclink = creaElemIn('div', document.body);//直达评论链接sclink.className = "big_pic_sc";sclink.innerHTML = "直达评论";sclink.addEventListener("click", function(){scrollto(getTop(feedbox));}, false);if (!!appbox) {//检测到应用容器（微博文章或视频）时退出box.appendChild(appbox);if (!!wrpbox) box.removeChild(wrpbox);if (!!expbox) expbox.parentNode.removeChild(expbox);cssNode.innerHTML = '.media_box{display: none !important;} .big_pic_sc{position: fixed; left:10px; padding: 3px; border: 1px solid white; color: white; background: rgba(133,133,133,0.6); cursor: pointer;} .big_pic_sc{top: 430px}';return;}if (!!maintextimg) {//检测到有正文转发含有图片，自动展开maintextimg.innerHTML = "";//maintextimg.parentNode.insertBefore(document.createElement("br"), maintextimg);mtimg = creaElemIn("img", maintextimg);mtimg.src = maintextimg.getAttribute("imagecard").replace("pid=", "http://ww1.sinaimg.cn/bmiddle/") + ".jpg";mtimg.className = "big_pic";}var j = 0;for (var i = 0; i < imgl; i++) {console.log(j,imgthumbs[i].src);//提取大图if (/sinaimg.c(om|n)\/(orj|thumb)\d{3}/.test(imgthumbs[i].src)) {// http://ww3.sinaimg.cn/thumb180/005CeWgjjw1f28f73p6imj30cs07ot96.jpgimgsrc[i] = imgthumbs[i].src.replace(/(sinaimg\.c(om|n)\/)(orj|thumb)\d{3}/, "$1large");     console.log(j,imgsrc[i]);} else {j += 1;  //console.log(j,imgl,j == imgl);continue;}if (j == imgl) return;imgs[i] = creaElemIn('img', box);//creaElemIn('br', box);imgs[i].src = imgsrc[i];imgs[i].className = "big_pic";}if (j == imgl) {//没找到符合条件的大图，退出cssNode.innerHTML = '.big_pic_sc{position: fixed; left:10px; padding: 3px; border: 1px solid white; color: white; background: rgba(133,133,133,0.6); cursor: pointer;} .big_pic_sc{top: 430px}';return;}imgl = imgs.length;if (!!mtimg) imgl = imgs.unshift(mtimg); //console.log(imgs.length);// console.log(!!wrpbox + "1 " + !!expbox + "2");if (!!wrpbox) box.removeChild(wrpbox);if (!!expbox) expbox.parentNode.removeChild(expbox);var nclink = creaElemIn('div', document.body);//图片限宽链接nclink.className = "big_pic_nc";nclink.innerHTML = "图片限宽";nclink.addEventListener("click", function(){if (_limited) {for (var i = 0; i < imgl; i++) {imgs[i].className = "big_pic";}_limited = false;} else {for (var i = 0; i < imgl; i++) {imgs[i].className = "big_pic_n";}_limited = true;}}, false);var n1link = creaElemIn('div', document.body);//首个图片链接n1link.className = "big_pic_1c";n1link.innerHTML = "△首个图片";n1link.addEventListener("click", function(){scrollto(getTop(imgs[0])-topspare);}, false);var n2link = creaElemIn('div', document.body);//上个图片链接n2link.className = "big_pic_2c";n2link.innerHTML = "▲上个图片";n2link.addEventListener("click", function(){var t = document.documentElement.scrollTop; console.log("t:"+t);for (var j=imgl-1; j>=0; j--) { console.log(j,getTop(imgs[j]),getTop(imgs[j]) + imgs[j].height - topspare);if (t > getTop(imgs[j]) + imgs[j].height - topspare) {scrollto(getTop(imgs[j]) - topspare);n2link.innerHTML = "▲上个图片[" + (j+1) + " / " + imgl + "]";return;}}}, false);var n3link = creaElemIn('div', document.body);//下个图片链接n3link.className = "big_pic_3c";n3link.innerHTML = "▼下个图片";n3link.addEventListener("click", function(){var t = document.documentElement.scrollTop; console.log("t:"+t);for (var j=0; j<imgl; j++) { console.log(j,getTop(imgs[j]));if (t < getTop(imgs[j]) - topspare) {scrollto(getTop(imgs[j]) - topspare);n2link.innerHTML = "▲上个图片[" + (j+1) + " / " + imgl + "]";return;}}}, false);waitscroll();}function waitscroll(){  //等待页面完全载入再滚动var list_ul = getElementsByClass("list_ul", 'div')[0];   //↓等待评论框架载入，如果评论框架就位就等待评论区或无评论提示载入，再视滚动位置判断if (!list_ul || (!list_ul.getElementsByTagName('div')[0] || !getElementsByClass("tips_rederror", 'div')[0]) || document.documentElement.scrollTop < (topheight+70)) {setTimeout(waitscroll, 300);  //console.log("wait");return;} else {scrollto(topheight);  //console.log("scroll");}}function scrollto(pos){  //滚动document.documentElement.scrollTop = pos;}// Create an elementfunction creaElemIn(tagname, destin) {var theElem = destin.appendChild(document.createElement(tagname));return theElem;}// Get the first element by xpathfunction getElem(xpath) {return document.evaluate(xpath, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null).snapshotItem(0);}// Get elements by classnamefunction getElementsByClass(cName ,tagName){var elements = tagName ? document.getElementsByTagName(tagName) : document.getElementsByTagName('*');var findEles = [];var reg = new RegExp('^'+cName+'\\s*|\\s+'+cName+'\\s+|\\s+'+cName+'$');for(var i=0;i<elements.length;i++) {if(reg.test(elements[i].className))findEles.push(elements[i]);}return findEles;}// Get the absolute top of an elementfunction getTop(e){var offset=e.offsetTop;if(e.offsetParent!=null) offset+=getTop(e.offsetParent);return offset;}// 通过模拟请求展开超长微博function getlongtext() {var longtext = document.getElementById('plc_main').querySelectorAll('[action-type="fl_unfold"]')[0];   //可展开的按钮if (!longtext) return;var mid = longtext.getAttribute('action-data').slice(4);GM_xmlhttpRequest({'method': 'GET','url': 'http://' + document.domain + '/p/aj/mblog/getlongtext?ajwvr=6&mid=' + mid,'onload': function (_h) {var html = JSON.parse(_h.responseText).data.html;longtext.parentNode.innerHTML = html;}});}})();

微博插件-微博图片全显示（页面样式本人优化版）相关推荐

artdialog html4,artdialog_ (dialog4) 显示页面样式的用法
简介这篇文章主要介绍了artdialog_ (dialog4) 显示页面样式的用法以及相关的经验技巧,文章约8839字,浏览量170,点赞数3,值得参考! pageEncoding="UTF ...
使用poi根据模版生成word文档，支持插入图片，复制表格，插入、循环插入数据，继承模板大部分格式及样式（优化版）
一.制作word模版,${xxxx}是一会要替换的内容,最下面的表格是要插入数据,根据是否以$开头来判断是需要替换还是插入数据, 注意如果是需要循环插入数据,制作的表格模版需要一行全部输入井号#,格式 ...
微信小程序页面添加背景图，图片全屏显示
前言微信的wxss里面不允许使用使用 background: url(),只能另外找方法进行背景图片显示. 方法 1.wxss页面里面设置页面的全屏宽高,以及view添加宽高 page{height ...
uniapp 背景图片全屏显示在整个页面
要让uniapp中的背景图片全屏,可以在<style>标签中添加以下样式: page {background-image: url('/static/bg.jpg');background ...
QRCode 扫描二维码、扫描条形码、相册获取图片后识别、生成带 Logo 二维码、支持微博微信 QQ 二维码扫描样式...
QRCode 扫描二维码.扫描条形码.相册获取图片后识别.生成带 Logo 二维码.支持微博微信 QQ 二维码扫描样式参考链接:https://github.com/bingoogolapple/B ...
js大屏导出图片_超大图片全屏动态展示js插件
intense-images是一款非常实用的超大图片全屏动态展示js插件.该图片查看插件可以全屏显示超大图片,可以使用鼠标来和图片进行交互,上下左右移动鼠标会相应的移动图片,对于超大图片的展示是非常好 ...
发送图片微博_微博引流之（实时号养成内幕解析）！
关于微博实时号! 整理了最近新加小伙伴问了最多的问题! 由于过于基础,就在这统一回复吧! 实时号怎么养? 先给大家科普一下什么是实时号,微博实时号指的是,你发的内容别人在搜索关键词或者某句话的时候,能 ...
0005 前端 Html 04 AutoFileName 图片的显示文字链接图片链接页面内链接列表加超链接的列表
以下为学习笔记,用来备忘.交流工具:Sublime Text 3 渲染:谷歌浏览器 AutoFileName工具的安装安装过程参见添加Emmet插件参考我上面安装Emmet插件的过程,基本一样. ...
Python 3.6实现单博主微博文本、图片及热评爬取
CodingGo技术社区自由的编程学习平台文章简介经常刷微博的同学肯定会关注一些有比较意思的博主,看看他们发的文字.图片.视频和底下评论,但时间一长,可能因为各种各样的原因,等你想去翻看某个博主 ...

微博插件-微博图片全显示（页面样式本人优化版）

微博插件-微博图片全显示（页面样式本人优化版）相关推荐

最新文章

热门文章