show and hide Javascript (display:none) issue

Question

I have created a show/hide javascript function which seems to work perfectly - When you click on the link it reveals the gif version of the logo.

The issue i'm having is when you first go onto the landing page click here you can see both images, it's only when you click on the still image the function works the way is should - only displaying one image at a time. Does anyone know how i can resolve this problem?

You should add 'display:none' in the css on the image you want to hide on load. — Preben Huybrechts
– Preben Huybrechts, Commented Jun 13, 2012 at 11:24

bjornruysen · Accepted Answer · 2012-06-13 11:24:05Z

2

You'll have to give the image a display:none style as well to start with:

<img id="center-img-gif" alt="main-img" src="css/images/logo.gif" style="display:none;">

answered Jun 13, 2012 at 11:24

bjornruysen

8501 gold badge6 silver badges15 bronze badges

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

Comments

U.P · Accepted Answer · 2012-06-13 11:24:14Z

0

use CSS property Display:none; for one of the images.

answered Jun 13, 2012 at 11:24

U.P

7,4527 gold badges42 silver badges63 bronze badges

Comments

yogi · Accepted Answer · 2012-06-13 11:25:14Z

0

You can set display:none of one image at design time OR You can set display:none of one image on body onload

answered Jun 13, 2012 at 11:25

yogi

19.7k13 gold badges67 silver badges93 bronze badges

Collectives™ on Stack Overflow

show and hide Javascript (display:none) issue

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related