3 Replies - 1398 Views - Last Post: 27 June 2013 - 08:50 PM

#1 moneymike47  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 15
  • Joined: 05-April 12

Changing an image on click

Posted 27 June 2013 - 01:46 PM

Hello all,

So I have a button on my website that is an image, and I am trying to make it so that when you click the image of the button, it will change to an image of a different button that give it the effect of the button being pushed. After looking around on the internet, this is what I have came up with:

<p style="text-align: center;">
	<span style="font-family: arial, helvetica, sans-serif;"><a href="/index.php/about-us/about-cmi"><img alt="" onclick="this.src='/images/yootheme/Button_Template_Long_CMI_Click copy.png';" src="/images/yootheme/Button_Template_Long_CMI copy.png" style="width: 144px; height: 35px;" /></a></span></p>


Originally I had it as this:

<p style="text-align: center;">
	<span style="font-family: arial, helvetica, sans-serif;"><a href="/index.php/about-us/about-cmi"><img alt="" src="/images/yootheme/Button_Template_Long_CMI copy.png" onclick="this.src='/images/yootheme/Button_Template_Long_CMI_Click copy.png';"  style="width: 144px; height: 35px;" /></a></span></p>


But when I saved it, it switched the original source and thee onclick source. My problem is that when i click the image of the button, the image does change like it is supposed to, but for whatever reason the image that appears is the broken image, and my img paths are all correct because when i type that into my browser, it goes the correct image.

Thank you in advanced!

Is This A Good Question/Topic? 0
  • +

Replies To: Changing an image on click

#2 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3569
  • View blog
  • Posts: 10,403
  • Joined: 08-June 10

Re: Changing an image on click

Posted 27 June 2013 - 01:55 PM

I might note that you can achieve th same effect with only CSS and a single image sprite (using the :active pseudo-class).
Was This Post Helpful? 0
  • +
  • -

#3 moneymike47  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 15
  • Joined: 05-April 12

Re: Changing an image on click

Posted 27 June 2013 - 02:01 PM

So there's no possible way you can do this in the HTML editor in Joomla! ?
Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3569
  • View blog
  • Posts: 10,403
  • Joined: 08-June 10

Re: Changing an image on click

Posted 27 June 2013 - 08:50 PM

I do not know that one (I am not using Joomla). I was generally speaking.

though one would usually not alter the HTML anyways, but the according JS or CSS files.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1