I have done everything for a better experience, and I hope not to be held accountable for using the following methods
I hope the author of 'Custom Tab' can see this code, which implements adaptive window size The current form can only be set to a fixed size and is not friendly for devices with different resolutions I hope to add an adaptive window size option, and I can only temporarily resolve it this way until further updates arrive
// ==UserScript==
// @name Unraid Custom Tab自适应窗体大小
// @namespace https://github.com/dixtdf/Unraid-Custom-Tab-Adaptive-Window-Size
// @version 1.0
// @description 窗体宽高随意设置即可
// @author dixtdf
// @match http*://*/*
// @icon https://upload.forums.unraid.net/live/monthly_2017_05/customlarge.png.e0cb690d73cea725de6927fc0abce6a7.png
// @grant none
// @license MIT
// ==/UserScript==
(function() {
function onWindowResize() {
let elementsByClassName = window.document.getElementsByClassName("content shift");
if (elementsByClassName.length>0){
let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title"));
if (computedStyle){
let height = window.innerHeight-(
window.document.getElementById("header").offsetHeight
+window.document.getElementById("menu").offsetHeight
+(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26)
+parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10)
+30
)
let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10)
let iframeElement = window.document.querySelector(".content.shift iframe");
iframeElement.style.width = width+"px";
iframeElement.style.height = height+"px";
iframeElement.style.border = "0px";
}
}
}
window.addEventListener("resize", function() {
clearTimeout(window.resizedFinished);
window.resizedFinished = setTimeout(onWindowResize, 200);
});
onWindowResize();
})();
Of course, you can manually edit/usr/local/emhttp/plugins/customtabtemp/View *. page to insert the following code into the last line, which can achieve the same effect
<script>
function onWindowResize() {
let elementsByClassName = window.document.getElementsByClassName("content shift");
if (elementsByClassName.length>0){
let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title"));
if (computedStyle){
let height = window.innerHeight-(
window.document.getElementById("header").offsetHeight
+window.document.getElementById("menu").offsetHeight
+(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26)
+parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10)
+30
)
let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10)
+parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10)
let iframeElement = window.document.querySelector(".content.shift iframe");
iframeElement.style.width = width+"px";
iframeElement.style.height = height+"px";
iframeElement.style.border = "0px";
}
}
}
window.addEventListener("resize", function() {
clearTimeout(window.resizedFinished);
window.resizedFinished = setTimeout(onWindowResize, 200);
});
onWindowResize();
</script>