Erstellen Sie eine Div, die alle Seite überlagern und alle Ereignisse erfasst

-2

Ich möchte ein Div, dass alle Seite überlagern und ich möchte, dass das Div erfasst alle Ereignisse (insbesondere berühren) dann wenn eine Schaltfläche in der Seite ist die Schaltfläche nicht anklickbar sein . Ich habe versucht, mit:Erstellen Sie eine Div, die alle Seite überlagern und alle Ereignisse erfasst

background = document.createElement('div'); 
       background.style = ` 
       display:block; 
       width:100%; 
       height:100vh; 
       position:fixed; 
       top:0px; 
       left:0px; 
       z-index:9; 
       background-color:black; 
       opacity:0.3;`; 
       document.body.appendChild(background);

und dann

background.addEventListener('touchend', (e)=>{e.stopPropagation();}, true);

, aber es funktioniert nicht. Meine Seite ist in einem Cordova-Projekt.

Ok Ich habe behoben, das Problem war, dass in anderen Teil des Codes ich das Div gelöscht, bevor das Div konnte die Ereignisse verwalten.

Quelle

2017-04-05 asv

... uuuuund was haben Sie bisher versucht, dies zu tun, und wo haben Sie nicht weiterkommen? – j08691

https://jsfiddle.net/bv2oLrcs/

HTML:

<div id="myDiv"></div> 
<button>Click me if you can!</button>

CSS:

* { 
    margin: 0; 
    padding: 0; 
} 
#myDiv{ 
    width: 100%; 
    height: 100%; 
    border: 1px solid black; 
    position: fixed; 
}

Quelle

2017-04-05 20:37:00 Konstantinos

Ich habe diese Lösung versucht, aber es funktioniert nicht, meine Seite ist eine Seite eines Cordova-Projekts – asv

Dies kann nicht die eleganteste Lösung sein, aber das erste, was mir in den Kopf kommt, ist ein div erstellen, die Umschließt die gesamte Seite und setzt dann den Z-Index auf eine wirklich hohe Zahl und seine Höhe 100% und Breite 100%

Etwas wie folgt aus:

#overlay { 
    width:100%; 
    height:100%; 
    z-index:1000; 
} 

<body> 
<div id="overlay"> 

html content here! 

</div> 
</body> 

<script> 
$(document).on("click", "#overlay", function() { 
    alert("overlay clicked") 
});

Quelle

2017-04-05 20:40:36 Wonx2150

Erstellen Sie eine Div, die alle Seite überlagern und alle Ereignisse erfasst

Antwort

Verwandte Themen