...

View Full Version : Making a default image



j05hr
08-09-2010, 11:38 PM
Is there a way I can make a default image with this photo gallery.

HTML:


<a href="#"><img src="images/adnlawthumb.jpg" alt="" class="thumb" /><span><img src="images/adnlaw.jpg" alt="" /></span></a>
<a href="#"><img src="images/ascthumb.jpg" alt="" class="thumb" /><span><img src="images/asc.jpg" alt="" /></span></a>
<a href="#"><img src="images/betterspecsthumb.jpg" alt="" class="thumb" /><span><img src="images/betterspecs.jpg" alt="" /></span></a>
<a href="#"><img src="images/coffeethumb.jpg" alt="" class="thumb" /><span><img src="images/coffee.jpg" alt="" /></span></a>
<a href="#"><img src="images/heartthumb.jpg" alt="" class="thumb" /><span><img src="images/heart.jpg" alt="" /></span></a>
<a href="#"><img src="images/r2ethumb.jpg" alt="" class="thumb" /><span><img src="images/r2e.jpg" alt="" /></span></a>


CSS:


#contentLeft a span {
display: none;
}

#contentLeft a:hover span {
display: block;
position: absolute;
width: 160px;
height: 120px;
top:40px;
left:425px;
border: 0;
}

_Aerospace_Eng_
08-10-2010, 02:48 AM
Add an id one you want to be the default. e.g.

<a href="#" id="default"><img src="images/adnlawthumb.jpg" alt="" class="thumb" /><span><img src="images/adnlaw.jpg" alt="" /></span></a>
Then in your CSS do this

#contentLeft a span {
display: none;
}

#contentLeft a:hover span, #contentLeft a#default span {
display: block;
position: absolute;
width: 160px;
height: 120px;
top:40px;
left:425px;
border: 0;
}
The only downside is all of your images need to be the same height and width or you will see the default image all of the time.

j05hr
08-10-2010, 09:55 AM
Thanks, that works great.

Do you know of any way you can make it that when you hover over any image, so when you take the mouse off of it, the one you were on becomes the default one instead of the just the id="default" one?

_Aerospace_Eng_
08-10-2010, 12:53 PM
Not with HTML/CSS alone, no. You would need to use some javascript.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum