Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Regular Coder
    Join Date
    Mar 2006
    Posts
    160
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Special button help

    Hi, I have an image i made and i want it to be a button and when people put there mouse over it, it will change to something else. I was wondering if someone could show me how this code would look? I dont know if it would use html and css, please correct me if it doesnt. Thanks

  • #2
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    You wouldn't use either HTML or CSS; you'd use JavaScript. The answer to your query largely depends on what "something else" is though. If it's an image, here's some inline JavaScript that'll do the trick:

    <img
    src="ORIGINALIMAGEURL"
    onmouseover="this.src = 'ROLLOVERIMAGEURL';"
    onmouseout="this.src = 'ORIGINALIMAGEURL';"
    >
    Last edited by Arbitrator; 04-28-2006 at 03:04 AM. Reason: code revision
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #3
    Regular Coder
    Join Date
    Mar 2006
    Posts
    160
    Thanks
    0
    Thanked 0 Times in 0 Posts
    So this would be put inside a table right? Yes, its an image. Also could you submit a legend for what imageid and originalimage are?
    THanks again

  • #4
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    I revised the code to make it more obvious. The code is the image code itself; just insert it where you want the image to go.

    IMAGEURL would be something like image.gif or http://www.site.com/image.gif.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #5
    Regular Coder
    Join Date
    Mar 2006
    Posts
    160
    Thanks
    0
    Thanked 0 Times in 0 Posts
    (btw) i forgot to tell you i want to use it for my navigation buttons. same code right?

  • #6
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Correct, assuming those buttons are images.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #7
    Regular Coder
    Join Date
    Mar 2006
    Posts
    160
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok what if i wanted to change to a new page when i clicked on the button?

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS :hover

    You really don't need JavaScript for that; the :hover pseudoclass is widely supported on the a element by almost all browsers in use today, and since it can be regarded as non-essential (as long as it's crystal clear that it is a link to a new page), it will degrade nicely on older or non-graphical browsers that don't.

    You can apply the technique described in ALA's "Sliding Doors of CSS, part II" for this using a single image instead of two separate ones (you will need to adapt this to your particular situation).
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #9
    Regular Coder
    Join Date
    Mar 2006
    Posts
    160
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Could some one please post that same code but have a place where i can put my url for the page that i want it to go to when they click on it?


  •  

    Posting Permissions

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