user3806102
user3806102

Reputation: 13

javascript referring variables in clip:rect doesn't work

<!DOCTYPE html>
<html>
<head>
<style>
img
{
position:absolute;
top:50px;
}
</style>
</head>
<body>

<img id="myImg" src="w3javascript.gif" width="100" height="132">
<button type="button" onclick="clipImage()">Clip image</button>
<button type="button" onclick="clearClip()">Unclip image</button>

<script>
var a="50"
var b=30
var c=a-b

function clipImage()
{
document.getElementById("myImg").style.clip="rect(c+'px' 75px 75px 0px)";
}
function clearClip()
{
document.getElementById("myImg").style.clip="auto";
}
</script>

</body>
</html>

BTW I just took this code from w3schools.:) Sorry for not being specific in the question title but I wanted to know why can't I use the variables that I have created inside the clip:rect. Thanks for all the answer

Upvotes: 1

Views: 132

Answers (1)

Andy
Andy

Reputation: 63550

Your quote marks are off:

document.getElementById("myImg").style.clip = "rect(" + c + "px 75px 75px 0px)";

Upvotes: 2

Related Questions