Bonjour

j'ai un script tout simple qui me permet de cacher une image quand je suis dessus pour faire afficher du texte à la place.

Voila la code :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<div id="home-explain">
    			<ul>
    				<li class="first-row">
    					<h2><?= $this->translate('Create your professionnal website')?></h2>
    					<div>
        					<img src="/images/site_web.jpg" width="283" height="126" alt="" />
        					<p id="home-website-txt"><?= $this->translate('home website description')?></p>
    					</div>
    				</li>
    				<li class="middle first-row">
    					<h2><?= $this->translate('A tools easy to use')?></h2>
    					<div>
        					<img src="/images/tools.jpg" width="283" height="126" alt="" />
        					<p id="home-tool-txt"><?= $this->translate('home tools description')?></p>
    					</div>
    				</li>
    				<li class="first-row">
    					<h2><?= $this->translate('An hight performance referencing')?></h2>	
    					<div>			
        					<img src="/images/traffic.jpg" width="283" height="126" alt="" />
        					<p id="home-performance-txt"><?= $this->translate('home referencing description')?></p>
    					</div>
    				</li>		
    			</ul>	
<script type="text/javascript">
//<![CDATA[
	jQuery("#home-explain li div").mouseenter(function(){ 	
		jQuery(this).children('img').hide();		
		jQuery(this).children('p').show();		
		return false;
		})
	.mouseleave(function(){ 				
		jQuery(this).children('img').show();		
		jQuery(this).children('p').hide();		
		return false;
	});
//]]> 
</script>
mon problème es que lorsque je me positionne la souris sur le border de la div, on n'arrête pas de switcher entre l'image et le texte.

Avez-vous une solution qui permettrait de ne pas avoir cet effet?

Merci d'avance pour votre aide