Untitled

<!doctype html>
<html>
<head>
<SCRIPT TYPE="text/javascript">
<!--
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</SCRIPT>
<script language=JavaScript>
var TxtType = function(el, toRotate, period) {
        this.toRotate = toRotate;
        this.el = el;
        this.loopNum = 0;
        this.period = parseInt(period, 10) || 2000;
        this.txt = '';
        this.tick();
        this.isDeleting = false;
    };

    TxtType.prototype.tick = function() {
        var i = this.loopNum % this.toRotate.length;
        var fullTxt = this.toRotate[i];

        if (this.isDeleting) {
        this.txt = fullTxt.substring(0, this.txt.length - 1);
        } else {
        this.txt = fullTxt.substring(0, this.txt.length + 1);
        }

        this.el.innerHTML = '<span class="wrap">'+this.txt+'</span>';

        var that = this;
        var delta = 200 - Math.random() * 100;

        if (this.isDeleting) { delta /= 2; }

        if (!this.isDeleting && this.txt === fullTxt) {
        delta = this.period;
        this.isDeleting = true;
        } else if (this.isDeleting && this.txt === '') {
        this.isDeleting = false;
        this.loopNum++;
        delta = 500;
        }

        setTimeout(function() {
        that.tick();
        }, delta);
    };

    window.onload = function() {
        var elements = document.getElementsByClassName('typewrite');
        for (var i=0; i<elements.length; i++) {
            var toRotate = elements[i].getAttribute('data-type');
            var period = elements[i].getAttribute('data-period');
            if (toRotate) {
              new TxtType(elements[i], JSON.parse(toRotate), period);
            }
        }
        // INJECT CSS
        var css = document.createElement("style");
        css.type = "text/css";
        css.innerHTML = ".typewrite > .wrap { border-right: 0.08em solid #fff}";
        document.body.appendChild(css);
    };
	</script>

</head>
<style>
::-moz-selection {
       background-color: #191914;
       color: #3967e7;
}
::selection {
       background:rgba(25, 25, 20, 0.99);
       color: #3967e7;
}

/* unvisited link */
a:link {
color:#aab7b7;
text-decoration:none;
transition: all 0.8s ease;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
}

/* visited link */
a:visited {
color: #aab7b7;
border-bottom: dashed 1px #ab1352;
transition: all 0.8s ease;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
}

/* mouse over link */
a:hover {
color:#000000;
background-color:#cf3636;
transition: all 0.8s ease;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
}

/* selected link */
a:active {
    color: #cf3636;
}

::-webkit-scrollbar {width: 4px; height: 1px; background: #; border: solid 1px #000;
}
::-webkit-scrollbar-thumb { background-color: #191914; -webkit-border-radius: 0ex; border: solid 1px #3967e7;
}

body{
top:0px;
left:0px;
height:495px;
width:550px;
font-family:lucida console;
text-transform:uppercase;
color:#6bb8ff;
font-size:10px;
text-align:center;
background-image:url('https://s20.postimg.cc/68z5rvy0t/fearbtm.gif');
background-repeat:no-repeat;
padding:0px;
}

#null{
top:60px;
left:75px;
height:175px;
width:266px;
background:#191914;
position:absolute;
padding:0px;
overflow:auto;
}


#div1 {
  background-color: transparent;
  text-align: center;
  color:#2e2e2e;
  position: absolute;
  height:175px;
width:266px;
top:60px;
left:75px;
}

* { color:#fff; text-decoration: none;}

</style>
<body>
<div id="div1">
  <a href="" class="typewrite" data-period="2000" data-type='[ "ERROR 404", "SUCK MY ASS JAVASCRIPT", "I Love Design.", "I Love to Develop." ]'>
    <span class="wrap"></span>
  </a>
<div id="null">
<br><br>error 504 data corrupted.<br><br>i want to try and get this animated so that it looks like its being typed but i fucking hate javascript and i dont know another way @ god please fucking help.
</div>
<span id="typed"></span>
</div>

</body>
</html>