Sujet Précédent Sujet Suivant

Problème d'affichage menu circulaire css

cs_rahile Messages postés 3 Date d'inscription mardi 28 juin 2005 Statut Membre Dernière intervention 24 mai 2010 - 12 mai 2010 à 18:11
cs_rahile Messages postés 3 Date d'inscription mardi 28 juin 2005 Statut Membre Dernière intervention 24 mai 2010 - 24 mai 2010 à 15:25
Bonjour
J'ai aussi un problème à l'affichage de ce menu car le celtre est décalé vers le haut à gauche.
j'ai remarqué que le code html que je colle sur JCE change quand je valide .Le
je suis obligé de mettre en blanc la couleur du div "centre" et du div "menu"

Voici l'url: http://www.tgvonona.org/index.php?opti [...] =73&Itemid=97

Code : CSS

#menu
{
width: 300px;
margin-top: 50px;
background-color: #DBDCFF;
border: 1px solid #000000;
}

#menu h2
{
position: absolute;
color: #0000EE;
text-align: center;
font-size: 15px;
}

#menu li
{
position: absolute;
list-style-type: none;
list-style-position: inside;
}

#centre
{
position: absolute;
height: 50px;
width: 50px;
margin: auto;
left: 650px;
top: 300px;
background-color: #ffffff;
border: 1px solid #ffffff;
}

.item
{
position: absolute;
}



Code : JavaScript


var decalage = 0;
var nbBout;
var timer;

function menu(nb)
{
var angle = 360 / nb;
nbBout = nb;
var posX;
var posY;
var rayon = 120;
var centreX = document.getElementById("centre").offsetLeft;
var centreY = document.getElementById("centre").offsetTop;
var lItem = 20;
var i = 1;
var item;
var b;

for(b = 0; b < 360; b += angle)
{
posX = centreX + 25 + rayon * Math.cos(b * Math.PI / 180);
posY = centreY + 25 + rayon * Math.sin(b * Math.PI / 180);

item = document.getElementById("item" + i);
item.className = "item";
item.style.top = (posY - lItem / 2) + "px";
item.style.left = (posX - lItem / 2) + "px";
i++;
}
}

function anim()
{
decalage++;
var angle = 360 / nbBout;
var posX;
var posY;
var rayon = 120;
var centreX = document.getElementById("centre").offsetLeft;
var centreY = document.getElementById("centre").offsetTop;
var lCentre = 50;
var lItem = 20;
var i = 1;
var item
var b;

for(b 0; b < 360; b b + angle)
{
posX = centreX + 25 + rayon * Math.cos((b + decalage) * Math.PI / 180);
posY = centreY + 25 + rayon * Math.sin((b + decalage) * Math.PI / 180);

item = document.getElementById("item" + i);
item.style.top = (posY - lItem / 2) + "px";
item.style.left = (posX - lItem / 2) + "px";
i++;
}
}
timer = setInterval(anim,50);


function stopanim()
{
clearInterval(timer);
}

function replayanim()
{
timer = setInterval(anim,50);
}



Code : HTML





<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Bienvenue sur le site de Tanora malaGasy Vonona</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="menu" href="menu/menu.css" />
<script type="text/javascript" src="menu/menu.js"></script>
</head>











<li id="item1">http://www.actumada.mg</li>
<li id="item2">http://www.lexpressmada.com/</li>
<li id="item3">http://www.madagate.com</li>
<li id="item4">http://www.laverite.mg</li>
<li id="item5">http://www.madagascar-tribune.com</li>
<li id="item6">http://www.lagazette-dgi.com</li>




</html>


ramhe

2 réponses

Réponse 1 / 2
cs_rahile Messages postés 3 Date d'inscription mardi 28 juin 2005 Statut Membre Dernière intervention 24 mai 2010
12 mai 2010 à 18:16
Voici l'url contenant le menu en question:

http://www.tgvonona.org/index.php?option=com_content&view=article&id=73&Itemid=97



ramhe
0
Réponse 2 / 2
cs_rahile Messages postés 3 Date d'inscription mardi 28 juin 2005 Statut Membre Dernière intervention 24 mai 2010
24 mai 2010 à 15:25
merci à vous tous
le problème est résolu


ramhe
0

Discussions similaires

menu en c
sebz10 -
decricri62 -

4 réponses
comment créer un sous menu
msi79 -
msi79 -

8 réponses
C# Buffer Circulaire (tableau circulaire)
apelleti -
Liverion -

7 réponses
Composant : référence circulaire AIE !!!
lbensch -
lbensch -

3 réponses
créer un menu principal
cs_valsta -
valsta -

5 réponses
Rejoignez-nous