I added an Event listener to the page, to catch every event but it doesn't work still. The code is more compact:
<?php
require_once("tabs.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
@import url(styles.css);
</style>
<script type="text/javascript" src="
http://ajax.googleapis.com/ajax/libs/prototype/1.7/prototype.js"></script>
<script type="text/javascript">
document.observe('dom:loaded', function(){
$('thing_1').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_1').replace('<div id="thing_1" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_2').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_2').replace('<div id="thing_2" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_3').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_3').replace('<div id="thing_3" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_4').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_4').replace('<div id="thing_4" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_5').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_5').replace('<div id="thing_5" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_6').on('mouseover', 'img', function(evt, elm){
evt.stop();
$('thing_6').replace('<div id="thing_6" class="gallerylink"><p><a href="
http://tinyurl.com/cwtt2yq">See Photo</a></p></div>');
});
$('thing_1').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_1').replace('<img id="thing_1" class="galleryitem" src="images/gallery1.jpg.jpg" onmouseover="showResult1();" style="position:relative; top:0px; left: 0px;"/>');
});
$('thing_2').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_2').replace('<img id="thing_2" class="galleryitem" src="images/
3188832812_573db43c7d.jpg" onmouseover="showResult2();"/>');
});
$('thing_3').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_3').replace('<img id="thing_3" class="galleryitem" src="images/
3188858500_3437070b8f.jpg" onmouseover="showResult3();"/>');
});
$('thing_4').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_4').replace('<img id="thing_4" class="galleryitem" src="images/
3188063503_e2b752444f.jpg" onmouseover="showResult4();"/>');
});
$('thing_5').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_5').replace('<img id="thing_5" class="galleryitem" src="images/
3188039487_5fa50f0d02.jpg" onmouseover="showResult5();"/>');
});
$('thing_6').on('mouseout', 'a', function(evt, elm){
evt.stop();
$('thing_6').replace('<img id="thing_6" class="galleryitem" src="images/
3188061317_d7a4bb7c27.jpg" onmouseover="showResult6();"/>');
});
});
</script>
<title>Python Speculative Interface</title>
</head>
<body>
<div class="main"><div id="header">
<?php tabs_start(); ?><div class="main">
<img class="logo" src="images/psi.png" /></div>
<?php tab( "Concept"); ?>
<div class="containere">
<div class="boxtab">
<form action="
http://joy.indivia.net/py/cgi-bin/OOpoetry.cgi" method="get">
<h>Python from a theoretical point of view</h>
<p>This interface aims to show and explain some communicative and theoretical aspects
inscribed in the mechanisms behind a programming language. The programming language named
Python is useful to achieve this goal as it provides an interpreter but it can even run
source code as object code.</p>
<p>If you search for a command of the python programming language in the form below you
will get the description of the logical and communicative process executed by it in the
machine. The explanation can be of a logical, mathematical or semiological nature.</p>
<p> This is an attempt to enhance python programming language as a signifying language,
which can execute not only algebrical processes but even what could be defined as meaning.</p><br />
<p>
<input id="example" name="stringx" value="type here"/> <input id="submit" type="submit" value="search"/></form></p>
</div>
<?php tab( "Wiki" ); ?>
<img class="logo" src="images/psi.png" />
<div class="main">
<div class="containere">
<div class="boxtab">
<h>Discussing about code and poetry</h>
<p>The various aspects of python programming language, and more in general of the object
oriented programming paradigm as a poetry, are discussed inside this
<a href="
http://joy.indivia.net/wiki/index.php">wiki</a></p>
<p>Every command will be provided with a discussion about the most trustworthy interpretation
you can give of it, and the execution it causes inside the machine. We will end at the level of
binary alphabet if it will be necessary. The final definition of every command will be connected
to this interface.</p>
<p> </p>
</div>
<?php tabs_end(); ?>
<ul><li>
<img id="thing_1" class="galleryitem" src="images/gallery1.jpg.jpg" style="position:relative; top:0px; left: 0px;"/>
</li><li>
<img id="thing_2" class="galleryitem" src="images/
3188832812_573db43c7d.jpg"/>
</li><li>
<img id="thing_3" class="galleryitem" src="images/
3188858500_3437070b8f.jpg"/>
</li><li>
<img id="thing_4" class="galleryitem" src="images/
3188063503_e2b752444f.jpg"/>
</li><li>
<img id="thing_5" class="galleryitem" src="images/
3188039487_5fa50f0d02.jpg"/>
</li><li>
<img id="thing_6" class="galleryitem" src="images/
3188061317_d7a4bb7c27.jpg"/>
</li></ul>
</div></div></div>
</body>
</html>
Can anyone help?
Thanks Agnese