Benutzer:Funbuilder/Spoilervorlage.js
Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.
- Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
- Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
- Internet Explorer/Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
- Opera: Strg+F5
var schwaerzung = true; function initSpoilerSchwaerzung(element, platzhalter, squelle) {//Bei Seitenaufruf var breite = element.textContent.width; var hoehe = element.textContent.height; element.style.width = breite; var schwarzesElement = document.createElement("a"); schwarzesElement.appendChild(document.createTextNode("Klicken um Spoiler aus „" + squelle.textContent + "“ anzuzeigen.")); //schwarzesElement.style.width = breite; //schwarzesElement.style.height = hoehe; schwarzesElement.style.backgroundColor = "rgba(100,100,100,1)"; schwarzesElement.style.color = "rgba(255,255,255,0)"; element.onclick=function() {toggleSchwaerzung(element, schwarzesElement)}; schwarzesElement.onclick=function() {toggleSchwaerzung(element, schwarzesElement)}; platzhalter.insertBefore(schwarzesElement, platzhalter.childNodes[0]); element.style.display="none"; squelle.style.display="none"; schwarzesElement.style.display="inline"; schwaerzung = true; schwarzesElement.addEventListener("mouseover", function(schwarzesElement) {// highlight the mouseover target schwarzesElement.target.style.color = "rgba(255,255,255,1)"; }, false); schwarzesElement.addEventListener("mouseout", function(schwarzesElement) {// highlight the mouseover target schwarzesElement.target.style.color = "rgba(255,255,255,0)"; }, false); } $(document).ready(function() { var allSpoilerSpans=document.getElementsByClassName("spoilerSchwaerzung"); var allPlatzhalterSpans=document.getElementsByClassName("spoilerPlatzhalter"); var allSpoilerQuellenSpans=document.getElementsByClassName("spoilerQuelle"); for (i=0; i<allSpoilerSpans.length; i++) { initSpoilerSchwaerzung(allSpoilerSpans[i], allPlatzhalterSpans[i], allSpoilerQuellenSpans[i]); } }); function toggleSchwaerzung(element, schwarzesElement) {//Bei Klick auf Spoiler if (schwaerzung == true) {//Wenn Spoiler sichtbar gemacht werden sollen element.style.backgroundColor = "rgba(255,0,0,0.3)"; element.style.color = ''; element.style.display="inline"; schwarzesElement.style.display="none"; schwaerzung = false; } else {//Wenn Spoiler geschwärzt werden sollen schwarzesElement.style.backgroundColor = "rgba(100,100,100,1)"; schwarzesElement.style.color = "rgba(255,255,255,0)"; element.style.display="none"; schwarzesElement.style.display="inline"; schwaerzung = true; } }