Hi, companion today we will see plainly the thing we will find in the article Javascript Task to Fabricate Topsy turvy Text Generator in Program Utilizing HTML5. We truly want to believe that you find this article extremely helpful.
Javascript Project to Build Upside Down Text Generator in Browser Using HTML5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="@housamz">
<meta name="description" content="Write Upside Down">
<title>Write Upside Down</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Custom CSS -->
<style>
body {
padding-top: 30px;
/* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}
</style>
<link rel="stylesheet" href="">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Page Content -->
<div class="container">
<div class="row">
<h1 class="text-center">Write Upside Down</h1>
<p>
This tool helps you write text upside down, and then you can copy the result and paste it in Twitter and Facebook.
</p>
<div class="form-group">
<form name="theForm" id="theForm">
<div class="col-lg-6">
<h4>Write Here</h4>
<textarea class="form-control" rows="10" name="source" onkeyup="updown(this)"></textarea>
</div>
<div class="col-lg-6">
<h4>Result</h4>
<textarea class="form-control" rows="10" name="resultf" readonly></textarea>
</div>
<div class="clearfix"></div>
</form>
</div>
</div>
<!-- /.row -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<footer class="footer">
<div class="container">
<p class="text-muted">By <a href="http://hmz.ie/" target="_blank">@housamz</a> 2016 <script>new Date().getFullYear()>2016&&document.write("-"+new Date().getFullYear());</script></p>
</div>
</footer>
<!-- jQuery Version 1.11.1 -->
<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script>
function updown(s) {
s = s.value.toLowerCase();
var last = s.length - 1;
var result = "";
for (var i = last; i >= 0; --i) {
result += rotateThis(s.charAt(i))
}
document.theForm.resultf.value = result;
}
function rotateThis(c) {
switch (c) {
case 'a':
d = '\u0250';
break;
case 'b':
d = 'q';
break;
case 'c':
d = '\u0254' ;
break;
case 'd':
d = 'p';
break;
case 'e':
d = '\u01DD';
break;
case 'f':
d = '\u025F' ;
break;
case 'g':
d = 'b';
break;
case 'h':
d = '\u0265';
break;
case 'i':
d = '\u0131';
break;
case 'j':
d = '\u027E';
break;
case 'k':
d = '\u029E';
break;
case 'l':
d = '\u05DF';
break;
case 'm':
d = '\u026F';
break;
case 'n':
d = 'u';
break;
case 'o':
d = 'o';
break;
case 'p':
d = 'd';
break;
case 'q':
d = 'b';
break;
case 'r':
d = '\u0279';
break;
case 's':
d = 's';
break;
case 't':
d = '\u0287';
break;
case 'u':
d = 'n';
break;
case 'v':
d = '\u028C';
break;
case 'w':
d = '\u028D';
break;
case 'x':
d = 'x';
break;
case 'y':
d = '\u028E';
break;
case 'z':
d = 'z';
break;
case '[':
d = ']';
break;
case ']':
d = '[';
break;
case '(':
d = ')';
break;
case ')':
d = '(';
break;
case '{':
d = '}';
break;
case '}':
d = '{';
break;
case '?':
d = '\u00BF' ;
break;
case '\u00BF':
d = '?';
break;
case '!':
d = '\u00A1';
break;
case "\'":
d = ',';
break;
case ',':
d = "\'";
break;
case '.':
d = '\u02D9';
break;
case '_':
d = '\u203E';
break;
case ';':
d = '\u061B';
break;
case '9':
d = '6';
break;
case '6':
d = '9';
break;
default:
d = c;
}
return d;
}
</script>
</body>
</html>Final Words
Javascript Venture to Construct Topsy turvy Text Generator in Program Utilizing HTML5 We genuinely want to believe that you find the article helpful and will see you in the following article.
