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
