Iframe vs. Mousemovement - oder: die Eltern-Kind-Konflikt

Question

Zunächst einmal mein Projekt hat ziemlich hart Einschränkungen:

• offline Verfügbarkeit
• als einfache Codierung wie möglich

=> PHP und andere Sprachen sind keine Option - nur HTML und Javascript.

---

Struktur:

• index.html
• frame.html

---

die index.html enthält:

• eine s imple iframe:

< iframe width = "100%" height = "100%" src = "frame.html" frameborder = "0">
</iframe>

• JavaScript zu deaktivieren rechten Mausklicks:

< script language = "javascript"> document.onmousedo wn = disableclick;
status = "Rechtsklick deaktiviert"; Funktion disableclick (Ereignis) {
if (event.button == 2) {
Warnung ("TEST");
Rückgabe false; }}
</script>

• Ein weiteres JavaScript zum Erfassen, wenn der Benutzer nicht aktiv ist:

< script> var timeoutID; Funktionseinstellung() {
this.addEventListener ("mousemove", resetTimer, false);
this.addEventListener ("mousedown", resetTimer, false);
this.addEventListener ("keypress", resetTimer, false);
this.addEventListener ("DIMMouseScroll", resetTimer, false);
this.addEventListener ("Mausrad", resetTimer, false);
this.addEventListener ("touchmove", resetTimer, false);
this.addEventListener ("MSPointerMove", resetTimer, false);>
startTimer(); } Konfiguration(); function startTimer() {
// Warten Sie X Sekunden, bevor Sie goInactive aufrufen
timeoutID = Fenster.setTimeout (goInactive, 3000); } function resetTimer (e) {
window.clearTimeout (timeoutID);
goActive(); } function goInactive() {
// etwas tun
alert ("TIMEOUT");
Rückgabe false; } function goActive() {
// etwas tun
startTimer(); }
</script>

• Die CSS-Datei auch einige Einschränkungen für den Maus-Cursor enthält:

body {
background-color: # f0f0f0;
Cursor: keine! Wichtig;
-webkit-user-select: keine;
-moz-user-select: keine;
-ms-user-select: keine; Benutzerauswahl: keine;
}

=> Das ist ganz gut für die index.html funktioniert - aber nicht für den iframe (die eine lokale Datei im selben Verzeichnis ist im Moment, aber es sollte auch auf eine Verknüpfung der Lage sein, Webseite).

Ich habe mehrere Abhilfen versucht, aber keiner von ihnen arbeitete , während die Website in der iframe lebendig halten (so dass Sie auch durch den Inhalt der frame.html sehen).

Ich bin offen für jede Lösung - wenn es die Skripte an das Kind übergeben oder wenn das Kind die Skripte von der übergeordneten oder einer Overlay-Lösung erhält. Wenn es eine Problemumgehung für das Iframe gibt, das auf einer Offline-Datei in demselben Verzeichnis umleitet, wäre das für den ersten Moment in Ordnung.

Vielen Dank im Voraus!

---

EDIT:

Still got Probleme mit diesem - es kommt zu einem nicht enden wollenden Schleife:

$('iframe').load(function(){ 
    $(this).contents().find("body").mousemove(function(){ 
var timeoutID; 
function setup() { 
    this.addEventListener("mousemove", resetTimer, false); 
    this.addEventListener("mousedown", resetTimer, false); 
    this.addEventListener("keypress", resetTimer, false); 
    this.addEventListener("DOMMouseScroll", resetTimer, false); 
    this.addEventListener("mousewheel", resetTimer, false); 
    this.addEventListener("touchmove", resetTimer, false); 
    this.addEventListener("MSPointerMove", resetTimer, false); 
    startTimer(); 
} 
setup(); 

function startTimer() { 
    timeoutID = (this).setTimeout(goInactive, 4000); 
} 

function resetTimer(e) { 
    (this).clearTimeout(timeoutID); 
    goActive(); 
} 

function goInactive() { 
    alert("TIMEOUT"); 
    return false; 
    goactive; 
} 

function goActive() {   
    startTimer(); 
} 
    }); 
}); 
$('iframe').attr("src","JavaScript:'iframe content'"); 

Answer 1

ich dies mit jQuery getan haben. Link.

Problem ist, dass Sie diese Cross-Domain nicht tun können, wenn Ihre iframe.html nicht in Ihrer Domain ist.