Reputation: 1321
I'm creating a text editor with an iframe
that has the contenteditable
attribute on. I added a zoom feature, that zooms in on the iframe
. Here's the code: document.getElementById("textareathingy").style.zoom = percentage;
When I use the zoom in feature, it makes the iframe
"bigger" but the size of the text remains the same. Can someone point me in the right direction to make the text within the iframe
also be zoomed in.
<html>
<body>
<button id = "btn" onclick = "zoom()">Click me!</button>
<iframe name = "textfield" id = "textareathingy" style = "border: 1px black solid; width: 100px; height: 100px"></iframe>
</body>
<script>
window.frames[0].document.body.innerHTML = "random text";
var percentage = 2;
function zoom() {
document.getElementById("textareathingy").style.zoom = percentage;
}
</script>
</html>
Upvotes: 2
Views: 826
Reputation:
You could use something like this instead:
document.getElementById("textareathingy").style.transform = "scale(" + percentage + ")";
Upvotes: 4