function flipText() {
var x = document.getElementById("myTextarea").value;
x = x.split("").reverse().join("");
x = x.toLowerCase();
var replaceChars = {
'a': 'ɐ',
'b': 'q',
'c': 'ɔ',
'd': 'p',
'e': 'ǝ',
'f': 'ɟ',
'g': 'b',
'h': 'ɥ',
'i': 'ı',
'j': 'ظ',
'k': 'ʞ',
'l': 'ן',
'm': 'ɯ',
'n': 'u',
'o': 'o',
'p': 'd',
'q': 'b',
'r': 'ɹ',
's': 's',
't': 'ʇ',
'u': 'n',
'v': 'ʌ',
'w': 'ʍ',
'x': 'x',
'y': 'ʎ',
'z': 'z',
'\?': '¿',
'!': '¡',
'\,': '\'',
'\'': '\,',
'\.': '˙'
};
x = x.replace(/a|b|c|d|e|f|g|h|i|j|k|l|m|n|o|p|q|r|s|t|u|v|w|x|y|z|!|\,|\'|\?|\./g, function(match) {
return replaceChars[match];
})
document.getElementById("target").innerHTML = x;
}
<textarea id="myTextarea" placeholder="Enter Your Text Here" rows="3" cols="30"></textarea> <textarea id="target" placeholder="Flipped Text Will Appear Here" rows="3" cols="30" style="direction: rtl;">
</textarea>
<br />
<button type="button" onClick="flipText()">Flip it</button>