SitePoint Sponsor

User Tag List

Results 1 to 17 of 17
  1. #1
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    table cell link & color change

    whats that onmouseover javascript that lets you change the css background color of a tablecell link?

    also, how do you make an entire table cell a link instead of just its contents?

    thanks

  2. #2
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think this is what you mean about the first part:

    <td bgcolor="#666666"
    onmouseover="this.style.background='009900'"
    onmouseout="this.style.background='666666'">

    That's how you make a cell change colors when someone hovers over it. Of course, you can change the colors to your liking.

    To make the entire cell a link, you have to put this:

    <td onclick="location.href"='URL'">

    Make sure you don't forget each of the quotes, double " ", and single, ' '.

    Therefore, the finished HTML might look like this:

    <td bgcolor="#666666" onclick="location.href"='URL'"
    onmouseover="this.style.background='009900'"
    onmouseout="this.style.background='666666'">

    Hope this helps!

    BTW, even though the cell becomes a link, it won't change to a HAND cursor, it will stay an arrow. So the fact that it is a link won't be obvious to visitors. You might want to add the CSS code to make the arrow change to a HAND on rollover. (sorry, don't know that code).
    Last edited by Adam P.; Jul 11, 2001 at 11:49.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com

  3. #3
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for the help. yep im adding the hand too. i want it to seem like they are buttons when they arent. its for www.wvmimaging.com/secure.html

  4. #4
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just want to point out that the rollover effect does not work in Netscape. Were you aware of that?
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  5. #5
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah i didnt think it did and i checked it just to make sure. ill make sure the text are links too so it works. damn netscape! =)

  6. #6
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by creole
    Just want to point out that the rollover effect does not work in Netscape. Were you aware of that?
    oh, not good. i didn't know that. man, NS can be so difficult at times.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com

  7. #7
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    netscape is ALWAYS difficult. want me to name the latest things ive been having trouble with in netscape?
    backgrounds
    borders
    css
    table sizes

    basically, everything i use =)

  8. #8
    You talkin to me? Anarchos's Avatar
    Join Date
    Oct 2000
    Location
    Austin, TX
    Posts
    1,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I made a script that will also work in netscape, I'll see if I can get around to publishing it in a couple of days.

  9. #9
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    wow really? what capabilities does it have? (all of css, backgrounds, underlines, etc) and how long is the script? do you think you could let me have the script a few days early so i can add it to the template PLEASE?

  10. #10
    You talkin to me? Anarchos's Avatar
    Join Date
    Oct 2000
    Location
    Austin, TX
    Posts
    1,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    For IE it changes the class, so you can modify whatever CSS you want, but Netscape only supports changing the background. It also automatically links the TD to the first anchor in the cell, displays the URL (or text of the cell if there isn't an anchor) when the mouse overs over the TD, and changes the mouse to a hand (IE only).

    Right now it's also setup to support "main" cells with one style/bgcolor combination and "sub" cells with a second style/bgcolor combination, so you can have a basic two-level structure.

  11. #11
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sounds cool, tell me when it's published. I would like to try it out.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com

  12. #12
    SitePoint Enthusiast pff's Avatar
    Join Date
    Dec 2000
    Location
    Google PageRank: 6
    Posts
    78
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Isn't there another way of doing this?
    Last edited by pff; Jul 12, 2001 at 10:11.
    pff | I am not what I am

    'Does he exist in the same way as I exist?'
    'You do not exist Winston,' said O'Brien.

  13. #13
    You talkin to me? Anarchos's Avatar
    Join Date
    Oct 2000
    Location
    Austin, TX
    Posts
    1,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    eh?

  14. #14
    SitePoint Zealot DarkMonkey's Avatar
    Join Date
    Apr 2001
    Location
    uk
    Posts
    170
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Would anyone know the code to change the mousecursor then? You've got me all worked up with the effect

  15. #15
    SitePoint Member FullMoon's Avatar
    Join Date
    Jul 2001
    Location
    Belgium
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just add
    Code:
    style="cursor:hand"
    Just look at http://www.dynamicdrive.com/dynamicindex11/fcursor.htm

  16. #16
    PHP Developer W1LL's Avatar
    Join Date
    Apr 2001
    Location
    Leicester, UK
    Posts
    459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Regarding the "whole cell as a link" thing, you can also do it without JavaScript...

    Code:
    <a href="*">
      <td>
        <p>blah blah</p>
      </td>
    </a>
    Though I'm not sure about the complience of the different browsers to this.

    - Will

  17. #17
    SitePoint Wizard geiger's Avatar
    Join Date
    Jul 2001
    Posts
    2,459
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    oh yeah i think that might work! i found out for myself tha tif you put the <form> tag before a <td> tag instead of after, it wont make your small rows or such larger than they should be


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •