change image width click [Archive]

yossidd

10-07-2012, 02:03 PM

i have simple code that chage the width of picture onclick
<script language="javascript">
var changed;
function ab(pic){
pic.style.height="16px";
}
</script>
<h4>text</h4>
<img src="image.png" onclick="ab(this); " />

i want to do when click on
<h4><h4>text</h4></h4>
it is run the function on the image..and change the width of picture
how? how i call to function?

coothead

10-07-2012, 02:54 PM

Hi there yossidd,

here is a one possible solution...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<title></title>

<style type="text/css">
#myh4 {
cursor:pointer;
}
#myh4:hover {
color:#900;
}
#myimg {
display:block;
border:1px solid #000;
margin:auto;
}
.image-width {
width:100px;
}
</style>

<script type="text/javascript">
function init() {
document.getElementById('myh4').onclick=function() {
document.getElementById('myimg').className='image-width';
}
}
window.addEventListener?
window.addEventListener('load',init,false):
window.attachEvent('onload',init);
</script>

</head>
<body>

<h4 id="myh4">text</h4>

<div>
<img id="myimg" src="image.png" alt="">
</div>

</body>
</html>

coothead