86 users online (0 members and 86 guests)  

> > > > FRAMES: rollover IMG links

  Results 1 to 9 of 9

Related

  1. CSS Image rollover??    Forum: CSS Forum
    Replies: 1
  2. rollover and the like    Forum: HTML Forum
    Replies: 0
  3. rollover images as links    Forum: Graphics Forum
    Replies: 6
  4. Please help me w/ Multiple Rollover Links II script!!    Forum: Javascript Forum
    Replies: 5
  5. targeting links on frames    Forum: HTML Forum
    Replies: 1
  1. 11-11-2003, 05:45 PM #1
    davidengel
    davidengel is offline
    davidengel's Avatar
    New User
    Status
    Offline
    Join Date
    Nov 2003
    Posts
    5

    Question FRAMES: rollover IMG links

    Okay. I have images in the bottom frame, "B" and a navigational bar on the top, "A". I want to make it so when I rollover or click an image in "B", descriptive text appears in "A". I just can't figure it out, and I am not sure if it is something I can do with HTML or if I have to do it with Java. Maybe it's impossible too. Basically, I have lots of images and don't feel like doing the old-fashioned Target= stuff because then I would have to make a separate .htm for each image. Any suggestions are greatly appreciated!

    Thanks!
    Reply With Quote Reply With Quote
  2. 11-11-2003, 06:22 PM #2
    QuietDean
    QuietDean is offline
    QuietDean's Avatar
    Administrator
    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hi there, welcome to the forums.

    You can access a page via JavaScript (not Java) by accessing the parent object, eg -

    HTML Code:
    onclick="parent.framename.imagename.src='stoat.jopg';"
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?
    Reply With Quote Reply With Quote
  3. 11-11-2003, 07:57 PM #3
    davidengel
    davidengel is offline
    davidengel's Avatar
    New User
    Status
    Offline
    Join Date
    Nov 2003
    Posts
    5
    I do not know how to put this code into action -- would it be at all possible for you to briefly explain to me what this code means? As in, which parts of the code need to be amended in order for it to make sense on my page?

    Thanks again
    Reply With Quote Reply With Quote
  4. 11-12-2003, 05:46 AM #4
    QuietDean
    QuietDean is offline
    QuietDean's Avatar
    Administrator
    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Sorry, you haven't showed me your page or your code, so I can only be vague.

    If you post some more details I can help more.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?
    Reply With Quote Reply With Quote
  5. 11-12-2003, 10:50 PM #5
    davidengel
    davidengel is offline
    davidengel's Avatar
    New User
    Status
    Offline
    Join Date
    Nov 2003
    Posts
    5

    Smile

    Thanks for sticking with me here. I hope I can articulate my problem a little bit better this time around. Here's the address:

    http://www.redrival.com/davidengel/photos.htm
    ---------------------HERES THE CODE---------------
    <html>
    <head>
    <title>Photos</title>
    </head>
    <body bgcolor="#99ccff" text="003399" link="goldenrod" alink="white" vlink="silver">
    <font face="futura md bt, arial, helvetica">

    <br><BR>
    <CENTER>

    <table cellpadding="4">

    <TD bgcolor="black">
    <a href="spsign1.jpg">
    <img height="60" width="40" src="spsign1.jpg" border=0></a>
    <a href="spsign2.jpg">
    <img height="60" width="40" src="spsign2.jpg" border=0></A>
    Menace in the dorm, 10/03</td>

    <TD bgcolor="black">
    <a href="rob.jpg" border=0>
    <img height="60" width="40" src="rob.jpg" border=0></A>
    Roommate, 10/30/03</TD>

    <TR>
    <TD bgcolor="black">
    <a href="brian.jpg">
    <img height="60" width="40" src="brian.jpg" border=0></a>
    <a href="brian1.jpg">
    <img height="60" width="40" src="brian1.jpg" border=0></A>
    Brian, our pet, 10/03

    <TD bgcolor="black">
    <a href="blocked.jpg">
    <img height="60" width="40" src="blocked.jpg" border=0></a>
    Picture of Me in the dorm, 9/03
    </TABLE>
    <CENTER><h1>Photos</h1></CENTER>
    Run the mouse over the picture and you will see a description above

    ---------------------------------------------------------

    OK. So I am using HTML frames (the only ones I am familiar with) and I have jpgs that, right now when you click them, open the photo in the "B" window (the blue one). That's just fine. I just want it so when you click on the photo, it will display text in the "A" window (the skinny dark red one) giving a description of the photo. I am sure there is some way to do this, and I would love to hear ANY ideas on how to go about it as long as they don't require that I make individual pages for each photo. I am not very familiar with JavaScript, so if you could explain the parts which I need to amend it would make it 10x easier for me. I REALLY appreciate your help!
    Reply With Quote Reply With Quote
  6. 11-13-2003, 03:36 AM #6
    QuietDean
    QuietDean is offline
    QuietDean's Avatar
    Administrator
    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hiya. I'll need the framesets code too
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?
    Reply With Quote Reply With Quote
  7. 11-13-2003, 06:08 PM #7
    davidengel
    davidengel is offline
    davidengel's Avatar
    New User
    Status
    Offline
    Join Date
    Nov 2003
    Posts
    5

    Here is the code for the frameset

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>

    <title>Photos</title>

    <FRAMESET ROWS="*,96%" FRAMEBORDER="0" FRAMESPACING="0" BORDER="0">
    <FRAME NAME="A" SRC="http://www.redrival.com/davidengel/photobar.htm" MARGINWIDTH="3" MARGINHEIGHT="10" SCROLLING="no">
    <FRAME NAME="B" SRC="http://www.redrival.com/davidengel/photos2.htm" MARGINWIDTH="3" MARGINHEIGHT="10">
    </FRAmESET>
    </html>
    Reply With Quote Reply With Quote
  8. 11-13-2003, 06:31 PM #8
    QuietDean
    QuietDean is offline
    QuietDean's Avatar
    Administrator
    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Heres a link that will write to frame A when clicked in frame B

    HTML Code:
    <a href="javascript:void(0);" onClick="parent.A.document.write('<h3>Ahha!</h3>');">Ahha!</a>
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?
    Reply With Quote Reply With Quote
  9. 11-13-2003, 09:33 PM #9
    davidengel
    davidengel is offline
    davidengel's Avatar
    New User
    Status
    Offline
    Join Date
    Nov 2003
    Posts
    5

    Script Looks Good, only one more question

    HERES ALL THE CODE I AM USING NOW

    •1. ORIGINAL FRAMESET PAGE ---------------------
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>

    <title>Photos</title>

    <FRAMESET ROWS="*,96%" FRAMEBORDER="0" FRAMESPACING="0" BORDER="0">
    <FRAME NAME="A" SRC="http://www.redrival.com/davidengel/photobar.htm" MARGINWIDTH="3" MARGINHEIGHT="10" SCROLLING="no">
    <FRAME NAME="B" SRC="http://www.redrival.com/davidengel/photos2.htm" MARGINWIDTH="3" MARGINHEIGHT="10">
    </FRAmESET>
    </html>
    --------------------END OF FRAMESET PAGE(http://www.redrival.com/davidengel/photos.htm)
    •2. BOTTOM FRAME, photos2.htm----------------------

    <html>
    <head>
    <title>Photos</title>
    </head>
    <body bgcolor="#99ccff" text="003399" link="goldenrod" alink="white" vlink="silver">
    <font face="futura md bt, arial, helvetica">

    <table cellpadding="4">
    <TD BGCOLOR="black">

    <a href="http://www.freewebs.com/davidengel/closet.jpg" onClick="parent.A.document.write('My kitchenette.');">
    <img height="60" width="40" src="http://www.freewebs.com/davidengel/closet.jpg" border=0></a>


    <a href="http://www.freewebs.com/davidengel/frombed.JPG" onClick="parent.A.document.write('View from my bed');">
    <img height="60" width="40" src="http://www.freewebs.com/davidengel/frombed.JPG" border=0></a>

    <a href="http://www.freewebs.com/davidengel/fromdesk.JPG" onClick="parent.A.document.write('View from my desk.');">
    <img height="60" width="40" src="http://www.freewebs.com/davidengel/fromdesk.JPG" border=0></A><BR>
    My room 11/12/03</td>

    <TD bgcolor="black">
    <a href="spsign1.jpg" onClick="parent.A.document.write('Sign located in the lobby of my dorm');">
    <img height="60" width="40" src="spsign1.jpg" border=0></a>
    <a href="spsign2.jpg" onClick="parent.A.document.write('Another sign that Rhode Island`s finest are in town');">
    <img height="60" width="40" src="spsign2.jpg" border=0></A><BR>
    Menace in the dorm, 10/03</td>

    <TD bgcolor="black">
    <a href="rob.jpg" border=0 onClick="parent.A.document.write('My roommate');">
    <img height="60" width="40" src="rob.jpg" border=0></A><BR>
    Roommate, 10/30/03</TD>

    <TR>
    <TD bgcolor="black">
    <a href="brian.jpg" onClick="parent.A.document.write('My pet hamster.');">
    <img height="60" width="40" src="brian.jpg" border=0></a>
    <a href="brian1.jpg" onClick="parent.A.document.write('Who`s the man?');">
    <img height="60" width="40" src="brian1.jpg" border=0></A>
    Brian, our pet, 10/03

    <TD bgcolor="black">
    <a href="blocked.jpg" onClick="parent.A.document.write('Weird stuff, man.');">
    <img height="60" width="40" src="blocked.jpg" border=0></a>
    Picture of Me in the dorm, 9/03
    </TABLE>
    <CENTER><h1>Photos</h1></CENTER>
    Click the picture you wish to see and you will see a description above

    --------------------------END OF BOTTOM FRAME, B(http://www.redrival.com/davidengel/photos2.htm)

    •3. TOP NAVIGATIONAL BAR--------------------------

    <html>
    <body bgcolor="darkred" text="#FFFFFF" <body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
    <font face="zurich ex bt"><table>
    <TABLE>
    <td VALIGN="top">
    <CENTER>Photo description:</center>
    </td>
    </table>
    </font>


    </body>
    </html>
    -------------------------END OF NAV. BAR, A
    (http://www.redrival.com/davidengel/photobar.htm)


    So, as you can see, when the images are clicked, indeed it does display text in the "A" frame, which is exactly what I wanted... I am just curious now as to how to clear the A frame when I click a different picture. Otherwise all that happens is the text builds up and the names of previously clicked images are still there. I need the top frame to get refreshed (clear the text) when I click on a new picture. I tried some things already, like return true, but I cannot figure it out. Like I said, I am pretty inexperienced, so that's why I am just dragging along on this one. I am confident that you can help me out -- I appreciate your help SO MUCH.

    Thanks
    Dave


    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Tags for this Thread