Member Avatar for Thermalnuke

Trying to have 2 buttons, one to add a border, one to remove the border when they're clicked. This is what I have so far, not sure where to go from here, would appreciate help.

<!doctype html>
<!-- mystery3.html  -->
<!-- This page changes an image source on button clicks. -->
<!-- =================================================== -->
<html>
<head>
<title>Mystery Image</title>
<style type="text/css">
.border-style1 {
    border-style: solid;
    border-width: 4px;
}
</style>
</head>
<body>

<img id="mysteryImg" src="http://upload.wikimedia.org/wikipedia/commons/f/f9/Giraffe_Portrait,_Woburn_Safari_Park.jpg" width="20%" height="20%"class="border-style1">
<p>
<input type="button" value="Show Border" 
onclick="document.getElementById('mysteryImg').border=1; 
'http://upload.wikimedia.org/wikipedia/commons/f/f9/Giraffe_Portrait,_Woburn_Safari_Park.jpg"'
'border=1'
<p>
<input type="button" value="Hide" Border 
onclick="document.getElementById('mysteryImg').border=0;
'http://upload.wikimedia.org/wikipedia/commons/f/f9/Giraffe_Portrait,_Woburn_Safari_Park.jpg"';">

</p>
</div>
</body>
</html>
  • 2 Contributors
  • 1 Reply
  • 116 Views
  • 7 Minutes Discussion Span
  • Latest Post Latest Post by LastMitch
Member Avatar for LastMitch

@Thermalnuke

Trying to have 2 buttons, one to add a border, one to remove the border when they're clicked. This is what I have so far, not sure where to go from here, would appreciate help.

I'm not sure maybe I'm wrong but you can't just used CSS because you need like script kinda like javascript to make that funciton work. So far the code you provided I don't see a javascript code related to your issue.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.