Supprimer les styles en ligne des images et ajuster la taille et la marge des cartes sur une page web
目前為
// ==UserScript==
// @name Change a card size in darkino
// @namespace http://tampermonkey.net/
// @version 0.1
// @description Supprimer les styles en ligne des images et ajuster la taille et la marge des cartes sur une page web
// @author Mtx1
// @match https://www2.darkino.net/*
// @grant GM_addStyle
// ==/UserScript==
(function() {
'use strict';
const images = document.querySelectorAll('img[loading="lazy"]');
const cards = document.querySelectorAll('.home-page-categories .videos .video-list.short, .video-latest-list.video-wrapper.short');
function removeImageInlineStyles() {
for (let img of images) {
img.removeAttribute('style');
}
}
function resizeCards(size) {
for (let card of cards) {
card.style.width = size + 'px';
}
}
function adjustCardMargin(margin) {
for (let card of cards) {
card.style.margin = margin + 'px';
}
}
const slider = document.createElement('input');
slider.type = 'range';
slider.min = '100';
slider.max = '300';
slider.value = localStorage.getItem('cardSize') || '300';
slider.style.marginLeft = '10px';
const valueDisplay = document.createElement('span');
const percentage = Math.round((((slider.value - 100) / 200) * 100));
valueDisplay.textContent = `${percentage}%`;
valueDisplay.style.marginLeft = '5px';
slider.addEventListener('input', (event) => {
const size = parseInt(event.target.value);
const percentage = Math.round(((size - 100) / 200) * 100);
valueDisplay.textContent = `${percentage}%`;
resizeCards(size);
adjustCardMargin(size / 10);
localStorage.setItem('cardSize', size);
});
const container = document.querySelector('.flex.justify-center.p-6');
container.appendChild(slider);
container.appendChild(valueDisplay);
removeImageInlineStyles();
const savedCardSize = localStorage.getItem('cardSize');
if (savedCardSize) {
resizeCards(savedCardSize);
adjustCardMargin(savedCardSize / 10);
}
})();