sinewalker
7/17/2015 - 12:48 PM

remove the browser prefixes -- animation andn @keyframes are standards now.

remove the browser prefixes -- animation andn @keyframes are standards now.

simple_cursor.html
content_copyfile_download
<!doctype html>
<html>
<head>
<title>simple_cursor</title>
<link rel="stylesheet" href="simple_cursor.css">
</head>
<body>
<pre>
<div class="cursor"> </div>
</pre>
</body>
</html>
simple_cursor.css
content_copyfile_download
html {
  background: #111;
}

body {
  color: #090;
  width: 480px;
  margin: 50px auto;

  font-family: Courier New, Courier, monospace;
  font-size: 14px;
  font-weight: bold;
  line-height: 16px;
}

div.cursor {
  display: inline-block;
  background: #111;
  margin-left: 1px;

  animation: blink 2s linear 0s infinite;
}
@keyframes blink {
  0%   { background: #0a0 }
  47%  { background: #090 }
  50%  { background: #000 }
  97%  { background: #000 }
  100% { background: #090 }
}
Blinken Light
content_copyfile_download
Simple blinking cursor... code from http://xip.io/ ...
Ofcourse I don't own the code! Just keeping it here as a 
reference of the CSS3 code used.