HTML/CSS - Hacking your Location [Real] Online Editor and JavaScript Compiler

html

<!DOCTYPE html>
<html>
    <head>
        <title>Location</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>   
        <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> 
    </head>
    <body>
       
     <audio id="myAudio" autoplay>
  <source src="https://dl.dropbox.com/s/91ugpc7kvahpslj/fast-pace-typing-on-mechanical-keyboard-1-www.fesliyanstudios.com.mp3" type="audio/mp3">
  <source src="https://dl.dropbox.com/s/91ugpc7kvahpslj/fast-pace-typing-on-mechanical-keyboard-1-www.fesliyanstudios.com.ogg" type="audio/mpeg">
</audio>
<pre>
           
███████████████████████████████████
█─█─██▀▄─██─▄▄▄─█▄─█─▄█▄─▄▄─█▄─▄▄▀█
█─▄─██─▀─██─███▀██─▄▀███─▄█▀██─▄─▄█
▀▄▀▄▀▄▄▀▄▄▀▄▄▄▄▄▀▄▄▀▄▄▀▄▄▄▄▄▀▄▄▀▄▄▀
       </pre>
       <table id="table"></table>   
     <canvas id="animation"></canvas>
     <div id="main">
        UserId : PallaviBhardwaj<br>
        Password : *************<br><br>
        <p id="line1">
            <font class="red">kali@root:</font><font class="blue">~</font><font class="white">$</font>

css

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}
html, body, .main{
    min-height: 100% !important;
    height: 100%;
}
body{
    background-color: #000;
}
#table {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 90%;
    font-size:13px;
    color: lime;
    margin:auto;
    display:none;
    border-style:dotted;
    padding:10px;
}
#table th{

function getIP(json) {
var ipad = json.ip;
document.getElementById("nmap").innerHTML = ipad;
document.getElementById("startnmap").innerHTML = ipad;
link = "https://ipapi.co/"+ipad+"/json/"
$.getJSON(link, function(data) {
function androidV(ua) { 
   ua = (ua || navigator.userAgent).toLowerCase();  
   var match = ua.match(/android\s([0-9\.]*)/i); 
   return match ? match[1] : undefined; 
};          document.getElementById("table").innerHTML = '<tr><th>About</th><th>Information</th></tr><tr><td>Android Version</td><td>'+ androidV() +'</td><tr><td>IP Adress</td><td>'+ data.ip +' (It may vary depending on your network...)</td></tr><tr><td>Country</td><td>'+ data.country_name+'</td></tr><tr><td>Region</td><td>'+ data.region +'</td></tr><tr><td>City</td><td>'+ data.city +' (It may be not exact because of ISP Provider Server location...)</td></tr><tr><td>Country Capital</td><td>'+ data.country_capital +'</td></tr><tr><td>Postal Code</td><td>'+ data.postal +'</td></tr><tr><td>Latitude</td><td>'+ data.latitude +'</td></tr><tr><td>Longitude</td><td>'+ data.longitude +'</td></tr><tr><td>TimeZone</td><td>'+ data.timezone +'</td></tr><tr><td>Phone Code</td><td>'+ data.country_calling_code +'</td></tr><tr><td>Currency</td><td>'+ data.currency_name +'</td></tr><tr><td>ISP</td><td>'+ data.org +'</td></tr><br><br><font style="font-size:20px;">Note :- This information is yours not any random....This is done using IP Address tracking API...';
    });
}

BROWSER

Console