Posted in General, JavaScript, Snippets, Web Development

How To Flip Text upside down and then backwards

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
<html xmlns=”http://www.w3.org/1999/xhtml”&gt;
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>FlipText</title>
<script type=”text/javascript”>
function flip() {
var result = flipString(document.f.original.value.toLowerCase());
document.getElementById(“results”).innerHTML = result;
}

function flipString(aString) {
var last = aString.length – 1;
var result = new Array(aString.length)
for (var i = last; i >= 0; –i) {
var c = aString.charAt(i)
var r = flipTable[c]
result[last – i] = r ? r : c
}
return result.join(”)
}

var flipTable = {
a : ‘\u0250’,
b : ‘q’,
c : ‘\u0254’,
d : ‘p’,
e : ‘\u01DD’,
f : ‘\u025F’,
g : ‘\u0183’,
h : ‘\u0265’,
i : ‘\u0131’,
j : ‘\u027E’,
k : ‘\u029E’,
//l : ‘\u0283’,
m : ‘\u026F’,
n : ‘u’,
r : ‘\u0279’,
t : ‘\u0287’,
v : ‘\u028C’,
w : ‘\u028D’,
y : ‘\u028E’,
‘.’ : ‘\u02D9’,
‘[‘ : ‘]’,
‘(‘ : ‘)’,
‘{‘ : ‘}’,
‘?’ : ‘\u00BF’,
‘!’ : ‘\u00A1’,
“\'” : ‘,’,
‘<‘ : ‘>’,
‘_’ : ‘\u203E’,
‘\u203F’ : ‘\u2040’,
‘\u2045’ : ‘\u2046’,
‘\u2234’ : ‘\u2235’,
‘\r’ : ‘\n’
}

for (i in flipTable) {
flipTable[flipTable[i]] = i
}
</script>
</head>

<body>

<form name=”f”>
<h3>Type Below</h3>
<textarea id=”clickcode” rows=”5″ cols=”50″ name=”original” onkeyup=”flip()”>Write your text in here!</textarea>
<div id=”results”></div>
</form>

</body>
</html>

Author:

Hello everyone. I'm a soccer playing, electronic music making ColdFusion guy.

Leave a comment