www.webdeveloper.com
Results 1 to 4 of 4

Thread: [HELP] How would i go about making my image show another when clicked on ?

Hybrid View

  1. #1
    Join Date
    Aug 2012
    Location
    Hull, England
    Posts
    5

    [HELP] How would i go about making my image show another when clicked on ?

    Hello guys,
    For my mobile web Application I wanted my icon (it runs the search commands), to display another image when I click on it so users know when it has registered the touch.

    I saw this on the net but didn't try it.

    Code:
    <img src=" URL_IMG-1 " onmouseover="images/search.png' URL_IMG-2 '" onmouseout="images/searchrollover.png' URL_IMG-1 '"  /></a>
    Would this work or is there another html solution ?

  2. #2
    Join Date
    Aug 2012
    Location
    Hull, England
    Posts
    5
    anyone ?

  3. #3
    Join Date
    Mar 2011
    Posts
    1,137
    This functionality actually requires (embedded) JavaScript. I'd ordinarily create a piece of discrete JavaScript to do something like this, but....
    Code:
    <img src="img1.jpg" onclick="(this.src.indexOf('img1.jpg') >=0) ? this.setAttribute('src','img2.jpg') : this.setAttribute('src','img1.jpg');;">
    Good thing I tested this a bit. It turns out you can't just test for equality here when the 'src' attribute is set to a relative URL. Firefox converts it into a complete URL in my testing. So I used indexOf as a workaround, but it's probably not best practice. Someone else might chime in with a better solution.
    Rick Trethewey
    Rainbo Design

  4. #4
    Join Date
    Nov 2012
    Posts
    1
    the #3 answer is useful?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles