Skip to content

Instantly share code, notes, and snippets.

@SteGriff
Created July 27, 2017 14:04
Show Gist options
  • Select an option

  • Save SteGriff/bffe206480ba3388a87b58f88e40be79 to your computer and use it in GitHub Desktop.

Select an option

Save SteGriff/bffe206480ba3388a87b58f88e40be79 to your computer and use it in GitHub Desktop.
Big Editor
<!DOCTYPE HTML>
<html>
<head>
<title>Big Edit</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body
{
font-family: -apple-system, BlinkMacSystemFont, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
select
{
width: 100%;
font-size: 150%;
}
.x5
{
font-size: 500%;
}
.x4
{
font-size: 400%;
}
.x3
{
font-size: 300%;
}
.x2
{
font-size: 200%;
}
</style>
</head>
<body>
<select class="js-font-size" onchange="SetSize()">
<option value="x5">&times;5</option>
<option value="x4">&times;4</option>
<option value="x3">&times;3</option>
<option value="x2" selected>&times;2</option>
</select>
<div class="js-editor x2" contenteditable>
Editable
</div>
<script>
function c(x){
return document.getElementsByClassName(x)[0];
}
function SetSize()
{
var newSize = c("js-font-size").value;
console.log(newSize);
var editor = c("js-editor");
editor.className = "js-editor " + newSize;
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment