Custom JS alert box by Codewith.it

<h1>
  Alert personalizzato
</h1>
<p>
  Lorem ipusm Tortor purus varius sagittis latinium rhoncus pharetra at blandit pharetra nulla vehicula et dolor nisi praesent risus fai varius vine commodo erat rubus magna vitae prose pulvinar class nisi mus himenaeos dictum risus aliquet vitae quisque sed placerat auctor fringilla aliquet senectus alon dui post elit senectus ante prie sem aenean mi curabitur risus amet urna aqua Sed et dis nullam sit magnis ut pretium lercius quisque suspendisse lobortis aqua auctor prie conubia augue et post Etiam els diam efficitur rhoncus romani convallis primis sed porta augue sit justo cubilia latinium alon etiam senectus aenean faucibus justo pellentesque sollicitudin duis arquitus odio praesent aptent arquitus aliquet ut viverra placerat vitae erat vestibulum nisi dapibus ullamcorper magnis ut turpis suscipit amet justo magnis aqua diam romani ambus vivamus consequat molestie risus post nisi interdum egestas porta aquitrinum nisi tempor non inceptos venir et post magna hendrerit curabitur sollicitudin condimentum deius placerat ante eget porttitor ante donec augue porttitor posuere at arcu etiam diam leo integer et nibh sagittis netus sit eleifend arquitus nascetur vehicula metus curabitur rutrum arquitus post porta elit vine eros venir sed risus sollicitudin varius commodo praesent lorem lercius vitae arcu consequat filo ut conubia maecenas casua lectus elit potenti turpis gravida convallis scelerisque efficitur semper ital filo volutpat madres litora diam phasellus nec eu placerat ante tempor per sem
</p> 
<button onclick="alert('Questo è un alert. Clicca per proseguire.'), alert('Ciao Ciao')">
  alert
</button>
<button onclick="prompt('Scrivi qualcosa:', 'Scrivi qui')">
  prompt
</button>
<button onclick="confirm('Confermi?')">
  confirm
</button>

HTML

✖

Info HTML

https://codewith.it/embed/?p=2458zbdEoifz

✖

Linguaggio:

CSS

✖

Info CSS

https://codewith.it/p/2458zbdEoifz.css

//Priorità
var vis = 1000;

//ALERT
window.alert = function (message) {
  var a = document.createElement('div');
  //regole di stile CSS
  a.style.cssText = "width:30vw; height:100px; border:1px solid #bbb; border-radius:5px; padding:10px; background:white; box-shadow:0px 0px 8px #0006; position:fixed; top:20px; right:0; left:0; margin:auto; font-family: \"Arial\", sans-serif; color:black; z-index:"+ vis+ ";";
  a.innerHTML = "<b>Alert</b><br>"+message;
  document.body.appendChild(a);
  vis--;
  a.addEventListener("click", function() {
    a.remove();
  }
  )

};

//PROMPT
window.prompt = function (message, def) {
  var a = document.createElement('div');
  var i = document.createElement('input');
  //regole di stile CSS
  a.style.cssText = "width:30vw; height:100px; border:1px solid #bbb; border-radius:5px; padding:10px; background:white; box-shadow:0px 0px 8px #0006; position:fixed; top:20px; right:0; left:0; margin:auto; font-family: \"Arial\", sans-serif; color:black; z-index:"+ vis+ ";";
  //input style
  i.style.cssText = "width:100%; margin-top:10px;";
  if (def) {
  	i.placeholder = def;
  }
  a.innerHTML = "<b>Prompt</b><br>"+message;
  document.body.appendChild(a);
  a.appendChild(i);
    vis--;
  i.addEventListener("keypress", function(e) {
    if (e.key === 'Enter') {
      alert(i.value);
        a.remove();
    }	
  }
)
};

//CONFIRM
window.confirm = function(message) {
  var a = document.createElement('div');
  var y = document.createElement('button');
  var n = document.createElement('button');  
  //regole di stile CSS
  a.style.cssText = "width:30vw; height:100px; border:1px solid #bbb; border-radius:5px; padding:10px; background:white; box-shadow:0px 0px 8px #0006; position:fixed; top:20px; right:0; left:0; margin:auto; font-family: \"Arial\", sans-serif; color:black;z-index:"+ vis+ ";";
  //buttons style
  y.style.cssText = "position:absolute; bottom:0; right:0; width:50%; margin:2px;clear:both;";
  n.style.cssText = "position:absolute; bottom:0; left:0; width:50%; margin:2px;clear:both;";
  a.innerHTML = "<b>Confirm</b><br>"+message;
    y.innerHTML = "Conferma";
    n.innerHTML = "Annulla";
  document.body.appendChild(a);
  a.appendChild(y);
  a.appendChild(n);
    vis--;
  
// case YES  
  y.addEventListener("click", function(e) {
      alert("Hai confermato");
      //fai qualcosa...
  	 a.remove();
  }
)
  //case NO
  n.addEventListener("click", function(e,resp) {
   		a.remove();

  }
)  
};

✖

Linguaggio:

JavaScript

✖

Info JS

https://codewith.it/p/2458zbdEoifz.js

Benvenuto su Codewith.it

Crea

Esplora

Novità

Benvenuto in Codewith.it

Pagine

Accedi

Conta caratteri

Lorem Ipsum Generator