Hello,

I just want to have a simple rollover image in a block using javascript.

I have inserted another input format to allow javascript, but still, my rollover does not work.

Here's what I have:

<script type="text/javascript">// <!--
setrollover('image_over.gif', 'image');
//--></script>

<a href="http://www.example.com" onmouseover="rollover('image')" onmouseout="rollout('image')"><img src="/images/image_out.gif" alt="bla bla" width="100"  height="50" border="0"></a>

Thanks

Comments

sheena_d’s picture

I would suggest just using CSS to make your rollover image. So, in your block you'd put the following HTML:

<a href="http://www.example.com" class="rollover" title="bla bla">alt text</a>

and in your CSS you'd put this:

a.rollover {
  display:block;
  width: 100px;
  height: 50px;
  background-image: url(path/to/image.gif);
  text-indent: -9999px;
}

a.rollover:hover {
  background-image: url(path/to/other-image.gif);
}

Much simpler, easier and will work whether or not the user has javascript enabled.

Hope that helps!

56rosa’s picture

Hi Sheena,

Thanks very much for helping on this. I forgot to say that I managed to make it work, simply by inserting a rollover image through the editor in Drupal. I hadn't seen that it was possible that way!

Thanks again. I appreciate.