div qui s’efface lorsque un menu se déroule dessus

salva · 30 Janvier 2010

Bonjour,

Soit un menu déroulant et dessous, une div contenant de l’adsense.

Je souhaiterais que la div s’efface lorsque le menu se déroule et éviter ainsi un ctrl fantaisiste.

J’ai cherché du côté de javascript mais je ne maîtrise même pas les bases avec ce langage et je patauge.

Si une âme charitable, à défaut de solution, pouvait m’aiguiller.
Merci.

GUITEL · 30 Janvier 2010

c'est un systeme dit "accordeon" que tu cherches en fait - Non ?

heu par exemple http://jquery.bassistance.de/accordion/demo/

salva · 30 Janvier 2010

Plutôt comme ceci.

GUITEL · 30 Janvier 2010

ha ok, c'est masquer une div par un évenement

je pense que ce lien devrait t'aider

http://www.kilasoft.net/modules/pages/index.php?pagenum=84

Notamment en prenant le dernier téléchargement en bas de la page

salva · 30 Janvier 2010

La solution que tu donnes affiche ou cache une div en cliquant sur un lien.

Dans mon cas, la div doit s'effacer au survol du menu déroulant par le curseur de la souris.
Je ne vois pas comment adapter ton exemple à mon besoin.

salva · 30 Janvier 2010

J'ai trouvé une solution qui fonctionne à moitié. Seule l'iframe réagit aux fonctions et pas l'adsense.
Adsense et l'iframe s'affiche sur une ligne.

Code:

<div id="pub" style="display:inline; margin-left: 14px;">

<script type="text/javascript"><!--
google_ad_client = "ca-pub-xxxxxxxxxxxxxxxx";
/* 728x90, xxxxxxx 12/08/09 */
google_ad_slot = "8760564491";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

<span style="margin-left: 9px;">
<iframe src="http://rcm-fr.amazon.fr/e/cm?t=wwwwwwwww-21&o=8&p=20&l=ur1&category=gift_certificates&banner=wwwwwwwwwwwwwwwww&f=ifr" width="120" height="90" scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0"></iframe>
</span></div>

Fontions affiche et cache:

Code:

function affiche()
	{
	element = document.getElementById("pub");
	element.style.visibility="visible";
	}
function cache()
	{
	element = document.getElementById("pub");
	element.style.visibility="hidden";
	}

Le lien

Code:

<a class="Menu" onMouseOver="cache();" onMouseOut="affiche();" href="/lien.html">Lien</a>

Une idée ?

GUITEL · 30 Janvier 2010

Code:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
#menu {
	width: 100px;
}
#image {
	width: 250px;
	margin-top: 100px;
	margin-right: auto;
	margin-left: 200px;
	position: absolute;
	height: 250px;
	text-align: center;
	vertical-align: middle;
	background-color: #009900;
}
-->
</style>
<script type="text/javascript">
<!--
function MM_showHideLayers() { //v9.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) 
  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>
</head>

<body>
<div id="menu"><a href="&quot;" onmousemove="MM_showHideLayers('image','','hide')" onmouseout="MM_showHideLayers('image','','show')">ton menu</a></div>
<div id="image">ton cadre adsence</div>
</body>
</html>

voilà le code au survol d'un lien
ça te va ?

salva · 30 Janvier 2010

Pas mieux, la div reste cachée en permanence.

En fait, la demi solution que j'ai trouvé ci-dessus fonctionne pour l'iframe mais pas pour le code adsense, qui sont pourtant tout les 2 contenus dans la même div. Et ce point là m'intrigue. Si quelqu'un pouvait éclairer ma lanterne.

GUITEL · 30 Janvier 2010

salva a dit:
Pas mieux, la div reste cachée en permanence.

ha non la div se masque au survol et réapparait ensuite quand tu n'es pas sur le lien !!

salva · 30 Janvier 2010

J'aimerais bien mais ce n'est pas le cas

Je ne dis pas que ça ne fonctionne pas chez toi.

salva · 31 Janvier 2010

J'arrive à faire fonctionner ma solution en intégrant le code Adsense dans une iframe.

Mais je crains que les pubs ne soient pas trop ciblées.

Zen pensez quoi ?

Que fait-il ajouter à cette fonction pour retarder l'affichage de la pub lorsque la souris quitte le menu

Code:

function affiche()
	{
	element = document.getElementById("pub");
	element.style.visibility="visible";
	}
function cache()
	{
	element = document.getElementById("pub");
	element.style.visibility="hidden";
	}