Erste Mausposition in einem Canvas-Elemente, wenn z-index = -1

Question

erscheint dies wie ein einfaches Problem. Ich habe eine Leinwand Anwendung, die ich schreibe Processing.js mit und ich möchte es im Hintergrund einer Webseite erscheinen. Um dies zu erreichen ich folgende CSS haben:

#canvas-back {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

Wo Leinwand-back ist die ID eines div, dass die tatsächlichen Leinwand enthält. Die Leinwand selbst eingestellt, um die Breite und Höhe des HTML Körperelements haben. Dies macht für mich richtig (die Leinwand im Hintergrund, unter meinem HTML-Inhalt), aber ich kann nicht mehr erfaßt die Variablen mouseX und mouseY (was processing.js Anwendungen die Mauskoordinaten zu erhalten).

Wie kann ich dieses Problem beheben? Ist es eine Frage der verschiedenen CSS oder gibt es eine andere Art und Weise Mauskoordinaten in processing.js zu bekommen? Danke.

Answer 1

Dachte, ich meine Lösung im Falle von jemand würde das gleiche Problem hat. Da war ich mit jquery Ich ging voran und setzen Sie neue Variablen, jmouseX und jmouseY, an der Mausposition.

jQuery(document).ready(function(){
    $(document).mousemove(function(e){
        jmouseX = e.pageX;
        jmouseY = e.pageY;
    }); 
})

Dann, wenn ich mouseX oder mouseY in meiner processingjs benötigen App benutze ich nur jmouseX und jmouseY.

Answer 2

Nun, da Sie den Z-Index auf -1 und Ihrem Körper hat, z-index Auto ändern, die Sie wie in diesem Fall 0 denken können, werden Sie nicht in der Lage sein, alle Klicks auf der Leinwand zu registrieren, da es unter dem Körper. Ihr Körper erhält alle Klicks und so weiter. Sie haben Ihre Mausereignisse auf dem Körper selbst in diesem Fall registrieren.

Wenn Sie Klicks auf der Leinwand bekommen müssen, das einzige, was ich vorschlagen kann, ist es z-index = 1 zu machen und es vollständig transparent zu machen. Aber in diesem Fall werden Sie nicht in der Lage, alle Elemente zu klicken, die im Körper sind, wie Schaltflächen, Links und Textfelder. Andernfalls werden Sie zu Capture-Ereignisse auf den Körper haben und manuell die coordinats in die Bibliothek vor, dass Sie verwenden.