<!DOCTYPE html>
<html>
<title>Text Multiplyer</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

<script>
function validateForm() {
    var x = document.forms["myForm"]["inputertext"].value;
    if (x == "") {
        alert("text must be filled out");
        return false;
    }
   
}


function multiplyer() {
 var y = document.getElementById("inputer").value;
        document.getElementById("outputer").innerHTML =
        y;
}
</script>


<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Exo');

div h1 {
font-family: 'Exo', sans-serif;
text-shadow: 2px 1px 2px #2c56a5;
}

</style>


<body>
  <div class="w3-card-4">
    <div class="w3-container w3-blue">
      <h1 align="center" >Text Multiplyer</h1>
    </div><br>
   
<div class="w3-container">


 
  <div class="w3-card-4">
    <div class="w3-container w3-green">
      <h1 align="center">Enter Text & Size Here </h1>
    </div>

    <form class="w3-container" name="myform">
      <p>
      <input class="w3-input" type="text" name="inputertext" id="inputer" placeholder="I am very happy">
      <label>Enter Text</label></p>
      <p>   
      <input class="w3-input" type="text" id="inputer" placeholder="10" >
      <label>Enter size</label></p>
      <input type="image" src="https://www.w3schools.com/tags/img_submit.gif" alt="Submit" width="48" height="48" onclick="return validateForm() multiplyer()">
      <h1 id="outputer"></h1>
    </form>
  </div>
</div>

</body>
</html>

Text Multiplyer

Text Multiplyer


Enter Text & Size Here



Comments

Popular posts from this blog