0

I need this page: http://winteradagency.com/mrw/index.php so that when you mouseover the different small images (actually a set of them) the text below changes from text into an image (which is a larger image of the smaller one) I used to use Fireworks for that sort of thing but I'm thinking that there must be an easier way using a combination of a div tage and javascript.

Any ideas for something simple?

thanks!

0

3 Answers 3

1

http://fancybox.net/

lightbox, etc...

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

2 Comments

this is good but I need something that you don't need to click it just needs to be a mouseover effect with the image being seen well below the mouseover in the bottom div container
You don't need to click, with a little extra js you can tie it to a mouseover instead.
1

The jQuery CYCLE plugin might suit your needs. It transforms a list of elements into a scrolling pane. You could simply disable automatic scrolling on initialization, and set the time between slides to 0. Then you can call the "slide number" in the callback for the mouseover event on the smaller thumbnails.

Cycle is here: http://malsup.com/jquery/cycle/

Your application is very similar to this example: link text

1 Comment

yes, this is close but it needs to be simply a mouseover effect not an onclick event.
0

This question has a similiar situation (replacing an input with an image) with an answer that might work for you. Note: it uses jQuery.

Edit: For your situation you could do something like this for each image:

$('img#id').hover(
  function() {
    ('div#id').hide().after('<img src="image.jpg" />');
  },
  function() {
    ('div#id').show();
  }
);

changing the 'img#id' to the id of the image and 'image.jpg' to the corresponding big image.

1 Comment

hmmm. I'm not able to connect the dots on that one. The image needs to be a mouseover not a click and display in the bottom div

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.