Greasy Fork

Greasy Fork is available in English.

转换微信公众号图片到兼容格式

将WEBP格式图片转换到JPEG、PNG等兼容性较好的格式

当前为 2019-10-11 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         转换微信公众号图片到兼容格式
// @description  将WEBP格式图片转换到JPEG、PNG等兼容性较好的格式
// @namespace    http://greasyfork.icu/users/197529
// @homepage     http://greasyfork.icu/scripts/390883
// @supportURL   http://greasyfork.icu/scripts/390883/feedback
// @author       kkocdko
// @license      Unlicense
// @version      0.5
// @match        *://mp.weixin.qq.com/*
// @inject-into  content
// ==/UserScript==
'use strict'

addFloatButton('转换全部图片到兼容格式', function () {
  document.querySelectorAll('img').forEach(el => {
    const imgUrlStr = el.dataset.src || el.src
    if (!imgUrlStr) { return }
    const imgUrl = new URL(imgUrlStr)
    imgUrl.searchParams.set('tp', 'png')
    const newImg = el.cloneNode()
    newImg.src = imgUrl.href
    el.parentNode.replaceChild(newImg, el)
  })
  this.style.background = '#4caf50'
  this.textContent = '全部图片都已转换完成!'
})

function addFloatButton (text, onclick) {
  if (!document.addFloatButton) {
    const buttonContainer = document.createElement('div').attachShadow({ mode: 'open' })
    buttonContainer.innerHTML = '<style>:host{position:fixed;top:3px;left:3px;z-index:2147483647;height:0}#i{display:none}*{float:left;margin:4px;padding:1em;outline:0;border:0;border-radius:5px;background:#1e88e5;box-shadow:0 1px 4px #00000022;color:#fff;font-size:14px;line-height:0;transition:.3s}:active{background:#42a5f5;box-shadow:0 2px 5px #00000033}button:active{transition:0s}:checked~button{visibility:hidden;opacity:0;transform:translateY(-3em)}label{border-radius:50%}:checked~label{opacity:.3;transform:translateY(3em)}</style><input id=i type=checkbox><label for=i></label>'
    document.body.appendChild(buttonContainer.host)
    document.addFloatButton = (text, onclick) => {
      const button = document.createElement('button')
      button.textContent = text
      button.addEventListener('click', onclick)
      return buttonContainer.appendChild(button)
    }
  }
  return document.addFloatButton(text, onclick)
}