Avtek Sign Dokumentation - Avtek Sign Documentation

Wenn der Benutzer das Transparenz-Kontrollkästchen aktiviert, wird das Widget in einen Offscreen-Buffer gerendert und anschließend auf den Bildschirm kopiert. Dadurch entsteht eine niedrige Aktualisierungsrate für den Inhalt des Widgets. Bedenken Sie dies beim Erstellen von Widgets.

Beachten Sie, dass dies nicht mit der “Chromium” web rendering engine funktioniert. Sie müssen diese Einstellung deaktiviert haben, um Transparenz zu unterstützen.

Um die Hintergrundtransparenz in Ihrem Widget zu aktivieren, fügen Sie einfach das folgende CSS in Ihren Widget-Code ein.

Transparency CSS

html, body {
        background-color: transparent;
}

Für die Simple Clock ändern Sie den Widget-Code wie folgt:

index.html

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
      html, body {
        background-color: transparent;
      }
</style>
<script>

var use_seconds = true;

function startTime() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    var s = 0
    m = checkTime(m);
	txtEl = document.getElementById('txt')

	if (use_seconds) {
		s = today.getSeconds();
    	s = checkTime(s);
		txtEl.innerHTML = h + ":" + m + ":" + s;
	}
	else {
    	txtEl.innerHTML = h + ":" + m;
	}
    window.t = setTimeout(startTime, 500);
}
function checkTime(i) {
    if (i < 10) {i = "0" + i};  // add zero in front of numbers < 10
    return i;
}
function init_widget(config) {
		if (!config) {
			return;
		}
		if("clock_font_size" in config){
			var pixels = config.clock_font_size + "px"
			document.getElementById('txt').style.fontSize = pixels;
		}
		if("use_seconds" in config){
			use_seconds = config.use_seconds;
		}
}

function start_widget(){
	startTime()
}

function stop_widget(){
	if(window.t){
		clearTimeout(window.t);
	}
}

</script>
</head>

<body>

<div id="txt" style="font-size: 48px"></div>

</body>
</html>