Trying to make a button in html with javascript

Question

I have never coded before so i dont know much, i watched this youtube video on how to make a js button youtube video

<div style="position:absolute; margin-left:1202px;"
<input type="image" src="images/login.png"
onmouseover="javascript:this.src='images/loginpressed.png';" 
onmouseout="javascript:this.src='images/login.png';" />
</div>

i can see that the code works in dreamweaver, but for somereason, others cannot see it on the website

Use a absolute address for your picture like: placekitten.com/20/20 to find the problem — frogatto
– frogatto, Commented Jul 18, 2013 at 9:45

GolezTrol · Accepted Answer · 2013-07-18 09:54:00Z

5

You forgot a > after <div style="position:absolute; margin-left:1202px;". Because of that, the button is now part of your div's declaration.

B.t.w. You can achieve a similar result by using another element than input type=image, like a span or div or an actual link element (a href) and apply some CSS to give it a different background image. For instance:

HTML:

<span class="button" onclick="alert('clicked');">Caption</span>

CSS:

.button {
  display: inline-block;
  height: 30px;
  background-image: url(normalstate.png);
}
.button:hover {
  background-image: url(hoverstate.png);
}

edited Jul 18, 2013 at 9:54

answered Jul 18, 2013 at 9:40

GolezTrol

116k19 gold badges186 silver badges215 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jay Shukla · Accepted Answer · 2013-07-18 09:40:21Z

0

It may possible that path to your images not found at other place.

answered Jul 18, 2013 at 9:40

Jay Shukla

5,8368 gold badges35 silver badges65 bronze badges

Collectives™ on Stack Overflow

Trying to make a button in html with javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related