Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Junior Member
    Join Date
    Oct 2008
    Posts
    4
    Member #
    17479
    Hi I have a web page with lots of thumbnails on my products the thumbnails link to web pages with full sized pictures of my products.

    I would like to have my thumbnails enlarge on mouse over to say 300 by 400 pixels so customers can see products better without having to load another page unless they wish.

    The really stupid thing is I found a piece of code that worked perfectly it was a bit long winded because i had to apply the onmouseover behavior to each image but it worked.
    I had 2 copies of my website running on my machine, made some changes. Ihought I saved the code in both folders and have some how lots the text file I had all my research in. Ahhhhhhhhhhh. along with all my bookmarks of research which im sure i saved

    I have only recently started web designing I built our website in hotmetal pro (really old program I know) in less than a week and am now using Dreamweaver CS3 I have been battling with this page for 3 nights now and i'm really stuck I think its something to do with the order i am writing the code but I've hit a wall and can't figure it out.

    Oh and just to make it more complicated i want it to work in Firefox as well as IE.

    Ok so this i what i've got

    <a href="setspages/red blue yellow milli set.htm"
    <img src= "Fg1" width="150" height="200"

    onMouseOver="this.src="rolloverimages/fgn1";this.height=400;this.width=300" onMouseout="this.src="Thumbs/necklacesandsets/FGN1.jpg";this.height=200;this.width=150">

    I've got to the point where thee more i stare at it the less sence it makes so im hoping someone out there can give me a straight forward answer.

    Many thanks for reading .

    Trf

  2.  

  3. #2
    Junior Member
    Join Date
    Oct 2008
    Posts
    4
    Member #
    17479
    ok so i have played with it again and think this is closer to being right but it still wont work. I know im a noob and it really annoying when peple ask other to fix for them. I hounestly am trying to google the answer my self.

    <a href="setspages/bluewhite beaded.htm"><img src="Thumbs/necklacesandsets/fgn2.jpg" alt="fgn2" width="150" height="200"></TD><td align="center"><a href="setspages/redblueset.htm"><img src="Thumbs/fgn3.jpg" width="115 "height="200" onMouseOver="rolloverimages/fgn3.jpg" width="300" height="400" onMouseOut="thumbs/fgn3" height="115" width="200"></a>

    What have done wrong please someone put me out of my missery so i can get on with the rest of my update.

  4. #3
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    What does not work, does the code produce an error?

  5. #4
    Junior Member
    Join Date
    Oct 2008
    Posts
    4
    Member #
    17479
    yes the code shows an error.
    the page still links to the enlargement page but when you move the mouse over the image it doesn't show the slightly larger image.

    Cheers

  6. #5
    Junior Member
    Join Date
    Oct 2008
    Posts
    4
    Member #
    17479
    just to let you all know with fresh eyes on it today I have fixed the code my self just in case anyone ever wants to do the same then the code for the image tag after any link code you wish for the image to point to the code should like this


    <img src="document/imagename.jpg" width="150" height="200" onMouseOver="this.src='document/imagename.jpg';this.height=400;this.width=300" onMouseOut="this.src='rolloverimages/fg1.jpg';this.height=200;this.width=150">


    you can change the onMouseOver command to a click and the onMouseOut command to a double click if you wanted and you will need to change the image name and location of the file but other wise you should be able to just copy and paste this code for any image on a webpage to produce a larger image on the same webpage just by rolling the mouse over said image.

    Hope this helps anyone else who wants to achive the same effect.

    peace.

    Tanith


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:09 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com