...

View Full Version : Jpeg Link Question



noneforit
04-13-2009, 05:38 PM
Hello

I am fairly new to web design and I have started my second website for a friens business.

Ok so on my homepage I have a main image with three smaller images underneath. What I want to happen is that when one of the smaller images is clicked, it changes the main image to the image that was clicked

I realise that is confusing so i have uploaded a picture of my site to the following link:

http://www.homepcvisit.com/test2/Sample.JPG

Hopefully I have made it clear enough what I want

Thanks

oesxyl
04-13-2009, 05:42 PM
you can't do this only with html and css, you need to use javascript. It's not so complicate to doit, in my opinion.

best regards

BoldUlysses
04-13-2009, 05:55 PM
oesxyl is right in that you'll need some JS. Frank (http://codingforums.com/member.php?u=46698) has been chasing this for quite some time. Here is (I believe) his latest iteration (http://exitfegs.co.uk/hoverstayc.html). It does what you want with the exception of the click functionality. You should be able to grab some code from there. Beyond that, consider asking a mod to move this thread to the JavaScript subforum (don't double post!).

Excavator
04-13-2009, 06:26 PM
Hello Laurieballard,
Have a look at this site - http://www.rolandandcompany.com/2005_projects/WES/index.html

No js, valid XHTML 1.0 Strict, works in IE7, IE8 and FF3 for sure. Just checked and IE6 may be a little flaky...

noneforit
04-13-2009, 06:49 PM
Hi Excavator

Thanks for the reply, that appears to be exactly what i am after.

Looking at the page source, its appears that all the coding for the mouseover etc is in the CSS sheet?

Thanks

Excavator
04-13-2009, 07:48 PM
Hi Excavator

Thanks for the reply, that appears to be exactly what i am after.

Looking at the page source, its appears that all the coding for the mouseover etc is in the CSS sheet?

Thanks

Yes, I seem to remember that's a linked CSS file.


...checking

Excavator
04-13-2009, 07:53 PM
Grab the CSS for that at http://nopeople.com/CSS/disjointed_rollover_photoalbum/wwt.css


It's pretty easy to find that with the Web Developer's Toolbar (https://addons.mozilla.org/en-US/firefox/addon/60)for FireFox.

I also use FireFox's firebug plug-in (http://getfirebug.com/).



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum