Hi, this is not a good solution.
Dissapearing happens as the rollover images wait for loading till you hover.
You should try to output simple Text for this hover state. Completly without new Images. Even better for search engines. Try to add a headline and a paragraph to each image, then simply lay them above the images with CSS when you hover.
A good Idea is to give the IMG and the surrounding A a display:block; so you can easylie formate them exactly. Give the container surrounding the IMG and the new Text display:relative; so you can lay the text over the image with position: absolute; Transparent background can be done with either a transparent image or CSS background-color: rgba(255, 0, 0, .5)
To start with mootools you can use the doc and its examples http://mootools.net/docs/core/Element/Element.Event
To include the JS into the page, you can use this code as in the moo_ templates
Code:
<script type="text/javascript">
/* <![CDATA[ */
(function($) {
window.addEvent('domready', function() {
// your code here
});
})(document.id);
/* ]]> */
</script>
Bookmarks