Home/ Questions/Q 7928177
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T19:40:16+00:00

My code below works in Firefox to toggle a border on an image,but does

  • 0

My code below works in Firefox to toggle a border on an image,but does not work in IE. Any ideas why ? In IE, the first click will add the border, but the second click will not remove the border again.

Thanks,
Leslie

<html>
<head>

<script type="text/javascript">

window.onload=function(){

    for(var i = 0; i < document.images.length; i++){
        document.images[i].onclick=function(){
        if(this.style.border == '2px solid red')
        {
            this.style.border='';
        }
        else this.style.border='2px solid red';
        }
    }

}

</script>

</head>
<body>
    <div>
        <img src="Cat.jpg" width="250"/>
        <img src="Dog.jpg" width="250"/>
        <img src="Fish.jpg" width="250"/>
    </div>

</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You’ve used if(this.style.border == '2px solid red'), and it’s rigth for FF but
    IE returns red 2px solid so if condition doesn’t match with IE. You may try this

    window.onload=function(){
for(var i = 0; i < document.images.length; i++)
{
    document.images[i].onclick=function(){
        if(this.style.borderColor == 'red' && this.style.borderStyle=='solid' && this.style.borderWidth=='2px')
        {
            this.style.border='none';
        } 
        else this.style.border='2px solid red';
      }
    }
}

    DEMO.

    Alternative: DEMO or DEMO (Better when you’ve other classes).

    • 0