SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    Online Dating Guru rawnet's Avatar
    Join Date
    Jan 2002
    Location
    Windsor, UK
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Mouseovers in IMG - just IMG tag, no header JS - is this possible?

    Hi,

    For stooopidly silly reasons, I need to create a mouseover effect just from the IMG tag - eg. I can't use any javascript from elsewhere on the site - all the instructions for the mouseover must be contained within the IMG tag.

    I can't for the life of me work out how to do this or if, indeed, it is actually possible.

    Can anyone enlighten me?

    Ross
    Ross Williams from WhiteLabelDating.com
    Webmasters - Add a dating channel to your website in minutes
    Earn 50% of all revenue generated - FREE SETUP

  2. #2
    We like music. weirdbeardmt's Avatar
    Join Date
    May 2001
    Location
    Channel Islands Girth: Footlong
    Posts
    5,882
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <IMG SRC="image.gif" onMouseover="document.images.image_name.src='newimage.gif';" NAME="image_name">
    Dunno if that will work in NS/Opera etc.

    I swear to drunk I'm not God.
    Matt's debating is not a crime
    Hint: Don't buy a stupid dwarf Clicky

  3. #3
    SitePoint Columnist Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,066
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've tested this in Mozilla and IE6 and it works fine in both browsers:
    Code:
    <img src="constr4.gif" width="144" height="50" onMouseOver="this.src='hackanm.gif'" onMouseOut="this.src='constr4.gif'">

  4. #4
    Online Dating Guru rawnet's Avatar
    Join Date
    Jan 2002
    Location
    Windsor, UK
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Guys,

    That's great! I'm using it in Javascript (.js) file, and it's causing problems though (getting a syntax error) :

    main_text0 = "<img src='images/nav_organisation_n.gif' alt='' width='212' height='22' border='0' onMouseover='document.images.image_name.src='nav_organisation_o.gif';'>"

    Is there any way I can use " characters within javascript without it throwing a tantrum?

    Ross
    Ross Williams from WhiteLabelDating.com
    Webmasters - Add a dating channel to your website in minutes
    Earn 50% of all revenue generated - FREE SETUP

  5. #5
    We like music. weirdbeardmt's Avatar
    Join Date
    May 2001
    Location
    Channel Islands Girth: Footlong
    Posts
    5,882
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi...

    1) Have you omitted the name tag? Looks like it (and you will need it):

    Code:
    <img src='images/nav_organisation_n.gif' alt='' width='212' height='22' border='0' onMouseover="document.images.image_name.src='nav_organisation_o.gif';" NAME="name">
    The bits in bold must match...

    If you're using a .js file... why don't you just use a proper function within that file? Just because you can't use headers, doesn't mean you can't use all that Javascript has available...
    I swear to drunk I'm not God.
    Matt's debating is not a crime
    Hint: Don't buy a stupid dwarf Clicky

  6. #6
    Online Dating Guru rawnet's Avatar
    Join Date
    Jan 2002
    Location
    Windsor, UK
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    HI Weirdbeard,

    Thanks for your help on this. I had missed the name attribute, and have put it in. My code is now thus :

    main_text0 = "<img src='images/nav_organisation_n.gif' alt='' name='organisation' width='212' height='22' border='0' onMouseover='document.images.organisation.src='nav_organisation_o.gif';'>"

    Alas, still getting a syntax error. It works fine without the onMouseover attribute, but blows when I put that back in. The reason it has to go in there is because this is the only part of the script that I can modify - the data in there is normally text, but I'm doing a workaround to put an image there instead. Which works. But now I'm being greedy and would like that image to have a mouseover effect as well.

    Is there any other way of writing it which is syntactically gentler?

    Ross (who knows bugger all about JS)
    Ross Williams from WhiteLabelDating.com
    Webmasters - Add a dating channel to your website in minutes
    Earn 50% of all revenue generated - FREE SETUP

  7. #7
    We like music. weirdbeardmt's Avatar
    Join Date
    May 2001
    Location
    Channel Islands Girth: Footlong
    Posts
    5,882
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, you should be able to do this:

    Code:
    main_text0 = "<img src='images/nav_organisation_n.gif' alt='' name='organisation' width='212' height='22' border='0' onMouseover=\"document.images.organisation.src='nav_organisation_o.gif';\">"
    The \ escapes the quote (i.e. tells it to print it not parse it). I tried it and it worked here OK.
    I swear to drunk I'm not God.
    Matt's debating is not a crime
    Hint: Don't buy a stupid dwarf Clicky

  8. #8
    Online Dating Guru rawnet's Avatar
    Join Date
    Jan 2002
    Location
    Windsor, UK
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wooohooo!!

    Cheers dude.

    Working sweet now. Many thanks!!
    Ross Williams from WhiteLabelDating.com
    Webmasters - Add a dating channel to your website in minutes
    Earn 50% of all revenue generated - FREE SETUP

  9. #9
    We like music. weirdbeardmt's Avatar
    Join Date
    May 2001
    Location
    Channel Islands Girth: Footlong
    Posts
    5,882
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No worries I s'pose you'll be wanting onMouseout too?
    I swear to drunk I'm not God.
    Matt's debating is not a crime
    Hint: Don't buy a stupid dwarf Clicky

  10. #10
    Online Dating Guru rawnet's Avatar
    Join Date
    Jan 2002
    Location
    Windsor, UK
    Posts
    246
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Managed to cobble that together myself. Feel quite satisfied now.
    Ross Williams from WhiteLabelDating.com
    Webmasters - Add a dating channel to your website in minutes
    Earn 50% of all revenue generated - FREE SETUP


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
  •