<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <h2> <a href="" class="typewrite pulse" data-period="2000" data-type='[ "Olá Candidato!", "Seja bem vindo ao processo seletivo<br>UPAE - Arruda.", "Não esqueça de preencher<br>todos os campos corretamente.", "Boa sorte!", ";)" ]'> <span class="wrap"></span> </a> </h2>

body { background-color:white; text-align: center; color:grey; padding-top:10em; } * { color:grey; text-decoration: none;} .wrap { animation: pulse 1s infinite; } .pulse { } @-webkit-keyframes pulse { 0% { border-right: 1.5px solid grey; } 70% { border-right: 1.5px solid white; } 100% { border-right: 1.5px solid grey; } } @keyframes pulse { 0% { border-right: 1.5px solid grey; } 70% { border-right: 1.5px solid white; } 100% { border-right: 1.5px solid grey; } }

//made by vipul mirajkar thevipulm.appspot.com 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 = 150 - 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 > .pulse { border-right: 2px solid grey}"; document.body.appendChild(css); };