0

So I am currently developing a terminal like website where you put in a command and something happens. This is what my CSS and HTML files looks like...

p {
  color: white;
  font-family: fixedsys, LucidaTerminal, monospace
}
.blink_text {
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: blinker;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  animation-name: blinker;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  color: white;
}
@-moz-keyframes blinker {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}
@-webkit-keyframes blinker {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}
@keyframes blinker {
  0% {
    opacity: 1.0;
  }
  50% {
    opacity: 0.0;
  }
  100% {
    opacity: 1.0;
  }
}
<!DOCTYPE html>

<head>
  <link rel="stylesheet" type="text/css" href="interface.css">
</head>

<body style="background-color:black;">
  <p style="display:inline">~/Link/Hydrogen/Helium/Lithium></p>
  <span class="blink_text">_</span>
</body>
So what I want is the user can type in a command, press enter, and something will happen, like "print 'python'" or like a help command that displays all commands. Also how do I make it so that when they press enter a command is executed.
Frumentum
  • 11
  • 3
  • Possible duplicate of [Capture key press without placing an input element on the page?](http://stackoverflow.com/questions/2878983/capture-key-press-without-placing-an-input-element-on-the-page) – Roy Falk Apr 30 '16 at 18:06

1 Answers1

0

Use a form with a textarea and make the borders and the background transparant. Do not add a submit button. Submit (with javascript fallback) on pressing enter. Does that work for you?

Mr. Hugo
  • 11,887
  • 3
  • 42
  • 60