I want the following button (and it's image) to change size when I click it. The dialog is showing, but the size is not changing..
<html>
<input type="image" src="pacman.png" onClick="
alert('test');
this.height='200px'; // change de button size
// this.image.height='200px'; // not sure if this line will work..
"/>
</html>
Need be in javascript, no in the css, becouse I'll make an animation later..
I want the following button (and it's image) to change size when I click it. The dialog is showing, but the size is not changing..
<html>
<input type="image" src="pacman.png" onClick="
alert('test');
this.height='200px'; // change de button size
// this.image.height='200px'; // not sure if this line will work..
"/>
</html>
Need be in javascript, no in the css, becouse I'll make an animation later..
Share Improve this question asked Sep 22, 2010 at 15:39 StudentStudent 28.4k70 gold badges165 silver badges267 bronze badges 1- 1 Are you using jQuery at all? If so, you can handle clicks and size changes easily. ie: $('#button').click(function(){$(this).css('height','200px');}); -- I don't advocate doing inline javascript like in your example, but if you're not using javascript elsewhere and don't need a library like jQuery, it's fine. – Brad Herman Commented Sep 22, 2010 at 15:40
2 Answers
Reset to default 7You have to manipulate the "style" property:
this.style.height = '200px';
You can do it with
this.style.height = "200px";
BUT, you should look into jQuery, an excellent Javascript library which makes it really easy to do that plus a LOT more! It's worth the small learning curve, trust me. http://www.jquery.