0

I have a javascript running on my home page to provide a read more facility, so part of the content is hidden until the read more link is clicked.

This works well but I would like to use an image instead of text.. I have managed to do this initially, but if you click the image it is replaced with text again.

The code I use is:

<script type="text/javascript">// <![CDATA[function toggle() { var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
  ele.style.display = "none";
text.innerHTML = "Read More";
}
else {
ele.style.display = "block";
text.innerHTML = "Hide";
}
}
// ]]></script> 

<p><a id="displayText" href="javascript:toggle();"><img alt="Reece Read More" src="/skin/frontend/rwd/default/images/Readmore_sml.png" /></a></p>

Any help would be appreciated.

0

Try with this piece of code:

function toggle() {
 var ele = document.getElementById("toggleText");
 var text = document.getElementById("displayText");
 if(ele.style.display == "block") {
      ele.style.display = "none";
  text.innerHTML = "<img alt='Reece Read More' src='/skin/frontend/rwd/default/images/Readmore_sml.png'>";
   }
 else {
  ele.style.display = "block";
  text.innerHTML = ""<img alt='Reece Hide' src='/skin/frontend/rwd/default/images/Hide_sml.png'>"";
 }
}
| improve this answer | |
  • Thank you for your help, that has cured one of my many headaches!! – tonylees May 9 '16 at 18:00
  • Remember Vote Up the answer it was useful for you – osrecio May 9 '16 at 19:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.