Sujet Précédent Sujet Suivant

Ouvrir une page dans la même page par un lien de menu javascript

doktr Messages postés 2 Date d'inscription jeudi 28 août 2003 Statut Membre Dernière intervention 30 août 2003 - 28 août 2003 à 17:15
benohite Messages postés 210 Date d'inscription vendredi 11 avril 2003 Statut Membre Dernière intervention 18 décembre 2003 - 29 août 2003 à 17:28

bonjour, merci de m'aider à résoudre un petit pb d'ouverture de page.

j'ai inséré un menu javascript dans l'une de mes pages, et j'aimerais pouvoir accéder à une autre page (dans la même fenetre) en cliquant sur le lien...

le code est le suivant (mon pb est à la fin) :

<style>
.dot {position:absolute;width:6;height:6;visibility:hidden;background-color:red;font-size:1px;z-index:100}
.dotoff {position:absolute;width:6;height:6;visibility:hidden;background-color:gray;font-size:1px;z-index:100}
.dotempty {position:absolute;width:6;height:6;visibility:hidden;background-color:orange;font-size:1px;zindex:100}
.caption {position:absolute;visibility:hidden;color:black;font-size:11px;text-align:center;z-index:1}
</style>


<script>
function getObjectRef(name) {
if(document.getElementById) return document.getElementById(name);
else if(document.all) return document.all[name];
else return null;
}
function show(name) {
var el = getObjectRef(name);
if(el) el.style.visibility = "visible";
}
function hide(name) {
var el = getObjectRef(name);
if(el) el.style.visibility = "hidden";
}
function getWidth(name) {
var el = getObjectRef(name);
return el.offsetWidth;
}
function getHeight(name) {
var el = getObjectRef(name);
return el.offsetHeight;
}
function moveMe(name,x,y) {
var el = getObjectRef(name);if(el) { el.style.top parseInt(y); el.style.left parseInt(x); }
}
function moveBy(name,x,y) {
var el = getObjectRef(name);if(el) { el.style.top parseInt(el.style.top) + parseInt(y); el.style.left parseInt(el.style.left) + parseInt(x);}
}
var menuCount = 0;
function menuObject(name,x,y,caption, r, parent) {
if ( (!document.getElementById&&!document.all) || navigator.userAgent.indexOf("Opera")>-1) return;
document.write('

');
document.write('
' + caption + '
');
this.name = name;
this.parent = parent
this.ref = "divDot" + menuCount;
this.caption = "divCap" + menuCount
if(r) this.radius = r;
else this.radius = 400;
this.subMenus = new Array();
this.state = 0;
this.moving = false;
if(this.parent) this.action = "null";
else this.action = "toggle";
if(this.parent) this.startAngle = parent.startAngle;
else this.startAngle = 0;
getObjectRef(this.ref).objRef = this.name;
this.show = function() { show(this.ref); }
this.hide = function() { hide(this.ref); }
this.moveMe = function(x,y) { if(this.parent) { x += this.parent.x(); y += this.parent.y(); } moveMe(this.ref,x,y); }
this.moveBy = function(x,y) { moveBy(this.ref,x,y); }
this.x = function() { return parseInt(getObjectRef(this.ref).style.left); }
this.y = function() { return parseInt(getObjectRef(this.ref).style.top); }
this.w = function() { return getWidth(this.ref); }
this.h = function() { return getHeight(this.ref); }
this.showCaption = function() {
moveMe(this.caption, this.x() - (getWidth(this.caption)/2) + (this.w()/2), (this.y() + this.h()));
show(this.caption);
}
this.hideCaption = function() {
hide(this.caption);
}this.setCaption function(c) { getObjectRef(this.caption).innerHTML c;}
this.addItem = function(c,action,r) {
getObjectRef(this.ref).className = "dot";
if(!r) r = this.radius/2;
var sub = new menuObject(this.name + ".subMenus[" + this.subMenus.length + "]",0,0,c,r,this);
sub.parent = this;
sub.action = action;
sub.moveMe(0,0);
this.subMenus[this.subMenus.length] = sub;
return sub;
}
this.expand = function() {
if(this.subMenus.length > 0) {
var p = true;
if(this.parent) {
p = !this.parent.moving;
for(var i=0; i<this.parent.subMenus.length;i++)
p = p && ((this.parent.subMenus[i].state==0) || (this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length)) && (this.parent.subMenus[i].moving==false);
} else var o = false;
if((!this.parent || this.parent.state == this.parent.subMenus.length) && p) {
if(this.parent) this.collapseAll(this.name);
var diff = 360 / this.subMenus.length;
for(var i=0;i<this.subMenus.length;i++){
this.subMenus[i].moveMe(0,0);
this.subMenus[i].show();
this.moving = true;
this.subMenus[i].slide(this.subMenus[i].radius * cos(degToRad((diff*i)+this.startAngle)), this.subMenus[i].radius * sin(degToRad((diff*i)+this.startAngle)), this.name + ".subMenus[" + i + "].showCaption();" + this.name + ".moving=false;" + this.name + ".state+=1;");
}
if(this.parent){
getObjectRef(this.parent.ref).style.filter = "alpha (opacity=33)";
getObjectRef(this.parent.ref).style.MozOpacity = "33%";
getObjectRef(this.parent.ref).className = "dotoff";
getObjectRef(this.parent.caption).style.filter = "alpha (opacity=33)";
getObjectRef(this.parent.caption).style.MozOpacity = "33%";
for(i=0;i<this.parent.subMenus.length;i++) {
getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "66%";
getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "66%";
}
if(this.parent.parent) {
for(i=0;i<this.parent.parent.subMenus.length;i++) {
getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=33)";
getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "33%";
getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotoff";
getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=33)";
getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "33%";
}
getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
getObjectRef(this.parent.parent.ref).className = "dotoff";
}}
getObjectRef(this.ref).style.filter = "alpha (opacity=66)";
getObjectRef(this.caption).style.filter = "alpha (opacity=66)";
getObjectRef(this.ref).style.MozOpacity = "66%";
getObjectRef(this.caption).style.MozOpacity = "66%";
}}}
this.collapse = function() {
var p = true;
p = !this.moving;
for(var i=0; i<this.subMenus.length;i++)
p = p && (this.subMenus[i].state==0) && (this.subMenus[i].moving==false);
if(p && this.subMenus.length > 0) {
for(var i=0;i<this.subMenus.length;i++){
this.subMenus[i].hideCaption();
this.moving = true;
this.subMenus[i].slide(0, 0, this.name + ".subMenus[" + i + "].hide();" + this.name + ".moving=false;" + this.name + ".state-=1;");
}
if(this.parent){
getObjectRef(this.parent.ref).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.ref).style.MozOpacity = "66%";
if(this.parent.subMenus.length != 0)
getObjectRef(this.parent.ref).className = "dot";
else
getObjectRef(this.parent.ref).className = "dotempty";
getObjectRef(this.parent.caption).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.caption).style.MozOpacity = "66%";
for(i=0;i<this.parent.subMenus.length;i++) {
getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=100)";
getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "100%";
if(this.parent.subMenus[i].subMenus.length != 0)
getObjectRef(this.parent.subMenus[i].ref).className = "dot";
else
getObjectRef(this.parent.subMenus[i].ref).className = "dotempty";
getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=100)";
getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "100%";
}
if(this.parent.parent) {
for(i=0;i<this.parent.parent.subMenus.length;i++) {
getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "66%";
if(this.parent.parent.subMenus[i].subMenus.length != 0)
getObjectRef(this.parent.parent.subMenus[i].ref).className = "dot";
else
getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotempty";
getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "66%";
}}}
getObjectRef(this.ref).style.filter = "alpha (opacity=100)";
getObjectRef(this.caption).style.filter = "alpha (opacity=100)";
getObjectRef(this.ref).style.MozOpacity = "100%";
getObjectRef(this.caption).style.MozOpacity = "100%";
}}
this.collapseAll = function(except) {
for(var i=0;i<this.parent.subMenus.length;i++) {
if(this.parent.subMenus[i].name!=except && this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length) {
this.parent.subMenus[i].collapse();
}}}
this.toggle = function(e) {
if(document.all) id = window.event.srcElement;
else id = e.target;
var dot = eval(id.objRef);
if(dot.state==0 && !dot.moving) dot.expand();
else if(dot.state==dot.subMenus.length && !dot.moving) dot.collapse()
}
this.doAction = function(e) {
if(document.all) id = window.event.srcElement;
else id = e.target;
var dot = eval(id.objRef);
if(dot.action == "toggle") dot.toggle(e);
else eval(dot.action);
}
getObjectRef(this.ref).onmouseup = this.doAction;
this.slide = function(xx,yy,func) {
if(!func) func = "";
var px = this.parent.x();
var py = this.parent.y();
var x = xx - this.x() + px;
var y = yy - this.y() + py;
var d = sqrt(square(xx-this.x() + px) + square(yy-this.y() + py));
var v = d/8;
if(v<1) v = 1;
if( (Math.abs(x) < v) && (Math.abs(y) < v) ) {
moveMe(this.ref,xx + px,yy + py);
if(func != "") eval(func);
} else {
var a = round(atan(x,y));
dx = round(v * cos(degToRad(a)));
dy = round(v * sin(degToRad(a)));
this.moveBy(dx,dy);
setTimeout(this.name + ".slide(" + xx + "," + yy + ", '" + func + "');",10);
}}
if (menuCount==0 && document.all) document.all[this.ref].style.filter = "alpha (opacity=100)";
menuCount++;
return this;
}
var pi = Math.PI;
function square(x) { return (x*x); }
function sqrt(x) { return Math.sqrt(x); }
function round(x) { return Math.round(x); }
function rand(x,y) { return (round(Math.random()*(y-x)) + x); }
function cos(x) { return Math.cos(x) }
function sin(x) { return Math.sin(x) }
function degToRad(x) { return ( x/(360/(2*pi)) ); }
function radToDeg(x) { return ( x*(360/(2*pi)) ); }
function atan(s,t) {
if( s == 0.0 && t > 0.0)
angle = 90.0;
else if(s == 0.0 && t < 0.0)
angle = 270.0;
else if (s < 0.0 )
angle = 180.0 + radToDeg(Math.atan(t/s));
else if (s > 0.0 && t < 0.0)
angle = 360.0 + radToDeg(Math.atan(t/s));
else {
if(s==0.0) s=0.00001;
angle = radToDeg(Math.atan(t/s));
}
if(angle < 0.0) angle += 360.0;
return angle;
}
if(document.all) pageWidth = document.body.offsetWidth-20;
else pageWidth = innerWidth;
if(document.all) pageHeight = document.body.offsetHeight-4;
else pageHeight = innerHeight;

// CREEZ ICI VOTRE MENU, BON COURAGE!!
var menu = new menuObject("menu",pageWidth/2,pageHeight/2,"Bienvenue", pageHeight/2);
menu.startAngle = -90;
menu.show();
menu.showCaption();

menu.addItem("Menu 1","toggle");
menu.addItem("Menu 2","toggle");
menu.addItem("Menu 3","toggle");
menu.addItem("Menu 4","toggle");

Votre texte ICI
J'aimerais en fait pouvoir ouvrir les pages qui s'appelles Lien 1, lien 2, etc... en cliqant sur les libellés Lien 1, Lien 2 etc..

A mon avis il faut remplacer "toggle" par une action d'ouverture de pas en les appelant, mais je connais pas la syntaxe.......

MERCI d'avance de m'aider.

doktr :)

A voir également:

Ouvrir une page dans la même page par un lien de menu javascript
Exemple de page d'authentification - Conseils pratiques -PHP
Appeler un fichier javascript dans une page html - Conseils pratiques -Javascript
Récupérer données json (javascript) - Conseils pratiques -Javascript
Exemple de page d'accueil html et css ✓ - Forum PHP
Javascript poo - Conseils pratiques -Javascript

3 réponses

Réponse 1 / 3

tominfo Messages postés 93 Date d'inscription samedi 17 mai 2003 Statut Membre Dernière intervention 30 janvier 2009
29 août 2003 à 16:06

-------------------------------
Réponse au message :
-------------------------------

> bonjour, merci de m'aider à résoudre un petit pb d'ouverture de page.
>
> j'ai inséré un menu javascript dans l'une de mes pages, et j'aimerais pouvoir accéder à une autre page (dans la même fenetre) en cliquant sur le lien...
>
> le code est le suivant (mon pb est à la fin) :
>
> <style>
> .dot {position:absolute;width:6;height:6;visibility:hidden;background-color:red;font-size:1px;z-index:100}
> .dotoff {position:absolute;width:6;height:6;visibility:hidden;background-color:gray;font-size:1px;z-index:100}
> .dotempty {position:absolute;width:6;height:6;visibility:hidden;background-color:orange;font-size:1px;zindex:100}
> .caption {position:absolute;visibility:hidden;color:black;font-size:11px;text-align:center;z-index:1}
> </style>
>
> 
> <script>
> function getObjectRef(name) {
> if(document.getElementById) return document.getElementById(name);
> else if(document.all) return document.all[name];
> else return null;
> }
> function show(name) {
> var el = getObjectRef(name);
> if(el) el.style.visibility = "visible";
> }
> function hide(name) {
> var el = getObjectRef(name);
> if(el) el.style.visibility = "hidden";
> }
> function getWidth(name) {
> var el = getObjectRef(name);
> return el.offsetWidth;
> }
> function getHeight(name) {
> var el = getObjectRef(name);
> return el.offsetHeight;
> }
> function moveMe(name,x,y) {
> var el = getObjectRef(name);> if(el) { el.style.top parseInt(y); el.style.left parseInt(x); }
> }
> function moveBy(name,x,y) {
> var el = getObjectRef(name);> if(el) { el.style.top parseInt(el.style.top) + parseInt(y); el.style.left parseInt(el.style.left) + parseInt(x);}
> }
> var menuCount = 0;
> function menuObject(name,x,y,caption, r, parent) {
> if ( (!document.getElementById&&!document.all) || navigator.userAgent.indexOf("Opera")>-1) return;
> document.write('

');
> document.write('
' + caption + '
');
> this.name = name;
> this.parent = parent
> this.ref = "divDot" + menuCount;
> this.caption = "divCap" + menuCount
> if(r) this.radius = r;
> else this.radius = 400;
> this.subMenus = new Array();
> this.state = 0;
> this.moving = false;
> if(this.parent) this.action = "null";
> else this.action = "toggle";
> if(this.parent) this.startAngle = parent.startAngle;
> else this.startAngle = 0;
> getObjectRef(this.ref).objRef = this.name;
> this.show = function() { show(this.ref); }
> this.hide = function() { hide(this.ref); }
> this.moveMe = function(x,y) { if(this.parent) { x += this.parent.x(); y += this.parent.y(); } moveMe(this.ref,x,y); }
> this.moveBy = function(x,y) { moveBy(this.ref,x,y); }
> this.x = function() { return parseInt(getObjectRef(this.ref).style.left); }
> this.y = function() { return parseInt(getObjectRef(this.ref).style.top); }
> this.w = function() { return getWidth(this.ref); }
> this.h = function() { return getHeight(this.ref); }
> this.showCaption = function() {
> moveMe(this.caption, this.x() - (getWidth(this.caption)/2) + (this.w()/2), (this.y() + this.h()));
> show(this.caption);
> }
> this.hideCaption = function() {
> hide(this.caption);
> }> this.setCaption function(c) { getObjectRef(this.caption).innerHTML c;}
> this.addItem = function(c,action,r) {
> getObjectRef(this.ref).className = "dot";
> if(!r) r = this.radius/2;
> var sub = new menuObject(this.name + ".subMenus[" + this.subMenus.length + "]",0,0,c,r,this);
> sub.parent = this;
> sub.action = action;
> sub.moveMe(0,0);
> this.subMenus[this.subMenus.length] = sub;
> return sub;
> }
> this.expand = function() {
> if(this.subMenus.length > 0) {
> var p = true;
> if(this.parent) {
> p = !this.parent.moving;
> for(var i=0; i<this.parent.subMenus.length;i++)
> p = p && ((this.parent.subMenus[i].state==0) || (this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length)) && (this.parent.subMenus[i].moving==false);
> } else var o = false;
> if((!this.parent || this.parent.state == this.parent.subMenus.length) && p) {
> if(this.parent) this.collapseAll(this.name);
> var diff = 360 / this.subMenus.length;
> for(var i=0;i<this.subMenus.length;i++){
> this.subMenus[i].moveMe(0,0);
> this.subMenus[i].show();
> this.moving = true;
> this.subMenus[i].slide(this.subMenus[i].radius * cos(degToRad((diff*i)+this.startAngle)), this.subMenus[i].radius * sin(degToRad((diff*i)+this.startAngle)), this.name + ".subMenus[" + i + "].showCaption();" + this.name + ".moving=false;" + this.name + ".state+=1;");
> }
> if(this.parent){
> getObjectRef(this.parent.ref).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.ref).className = "dotoff";
> getObjectRef(this.parent.caption).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.caption).style.MozOpacity = "33%";
> for(i=0;i<this.parent.subMenus.length;i++) {
> getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "66%";
> getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "66%";
> }
> if(this.parent.parent) {
> for(i=0;i<this.parent.parent.subMenus.length;i++) {
> getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotoff";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "33%";
> }
> getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.ref).className = "dotoff";
> }}
> getObjectRef(this.ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.ref).style.MozOpacity = "66%";
> getObjectRef(this.caption).style.MozOpacity = "66%";
> }}}
> this.collapse = function() {
> var p = true;
> p = !this.moving;
> for(var i=0; i<this.subMenus.length;i++)
> p = p && (this.subMenus[i].state==0) && (this.subMenus[i].moving==false);
> if(p && this.subMenus.length > 0) {
> for(var i=0;i<this.subMenus.length;i++){
> this.subMenus[i].hideCaption();
> this.moving = true;
> this.subMenus[i].slide(0, 0, this.name + ".subMenus[" + i + "].hide();" + this.name + ".moving=false;" + this.name + ".state-=1;");
> }
> if(this.parent){
> getObjectRef(this.parent.ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.ref).style.MozOpacity = "66%";
> if(this.parent.subMenus.length != 0)
> getObjectRef(this.parent.ref).className = "dot";
> else
> getObjectRef(this.parent.ref).className = "dotempty";
> getObjectRef(this.parent.caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.caption).style.MozOpacity = "66%";
> for(i=0;i<this.parent.subMenus.length;i++) {
> getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=100)";
> getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "100%";
> if(this.parent.subMenus[i].subMenus.length != 0)
> getObjectRef(this.parent.subMenus[i].ref).className = "dot";
> else
> getObjectRef(this.parent.subMenus[i].ref).className = "dotempty";
> getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=100)";
> getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "100%";
> }
> if(this.parent.parent) {
> for(i=0;i<this.parent.parent.subMenus.length;i++) {
> getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "66%";
> if(this.parent.parent.subMenus[i].subMenus.length != 0)
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dot";
> else
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotempty";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "66%";
> }}}
> getObjectRef(this.ref).style.filter = "alpha (opacity=100)";
> getObjectRef(this.caption).style.filter = "alpha (opacity=100)";
> getObjectRef(this.ref).style.MozOpacity = "100%";
> getObjectRef(this.caption).style.MozOpacity = "100%";
> }}
> this.collapseAll = function(except) {
> for(var i=0;i<this.parent.subMenus.length;i++) {
> if(this.parent.subMenus[i].name!=except && this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length) {
> this.parent.subMenus[i].collapse();
> }}}
> this.toggle = function(e) {
> if(document.all) id = window.event.srcElement;
> else id = e.target;
> var dot = eval(id.objRef);
> if(dot.state==0 && !dot.moving) dot.expand();
> else if(dot.state==dot.subMenus.length && !dot.moving) dot.collapse()
> }
> this.doAction = function(e) {
> if(document.all) id = window.event.srcElement;
> else id = e.target;
> var dot = eval(id.objRef);
> if(dot.action == "toggle") dot.toggle(e);
> else eval(dot.action);
> }
> getObjectRef(this.ref).onmouseup = this.doAction;
> this.slide = function(xx,yy,func) {
> if(!func) func = "";
> var px = this.parent.x();
> var py = this.parent.y();
> var x = xx - this.x() + px;
> var y = yy - this.y() + py;
> var d = sqrt(square(xx-this.x() + px) + square(yy-this.y() + py));
> var v = d/8;
> if(v<1) v = 1;
> if( (Math.abs(x) < v) && (Math.abs(y) < v) ) {
> moveMe(this.ref,xx + px,yy + py);
> if(func != "") eval(func);
> } else {
> var a = round(atan(x,y));
> dx = round(v * cos(degToRad(a)));
> dy = round(v * sin(degToRad(a)));
> this.moveBy(dx,dy);
> setTimeout(this.name + ".slide(" + xx + "," + yy + ", '" + func + "');",10);
> }}
> if (menuCount==0 && document.all) document.all[this.ref].style.filter = "alpha (opacity=100)";
> menuCount++;
> return this;
> }
> var pi = Math.PI;
> function square(x) { return (x*x); }
> function sqrt(x) { return Math.sqrt(x); }
> function round(x) { return Math.round(x); }
> function rand(x,y) { return (round(Math.random()*(y-x)) + x); }
> function cos(x) { return Math.cos(x) }
> function sin(x) { return Math.sin(x) }
> function degToRad(x) { return ( x/(360/(2*pi)) ); }
> function radToDeg(x) { return ( x*(360/(2*pi)) ); }
> function atan(s,t) {
> if( s == 0.0 && t > 0.0)
> angle = 90.0;
> else if(s == 0.0 && t < 0.0)
> angle = 270.0;
> else if (s < 0.0 )
> angle = 180.0 + radToDeg(Math.atan(t/s));
> else if (s > 0.0 && t < 0.0)
> angle = 360.0 + radToDeg(Math.atan(t/s));
> else {
> if(s==0.0) s=0.00001;
> angle = radToDeg(Math.atan(t/s));
> }
> if(angle < 0.0) angle += 360.0;
> return angle;
> }
> if(document.all) pageWidth = document.body.offsetWidth-20;
> else pageWidth = innerWidth;
> if(document.all) pageHeight = document.body.offsetHeight-4;
> else pageHeight = innerHeight;
>
> // CREEZ ICI VOTRE MENU, BON COURAGE!!
> var menu = new menuObject("menu",pageWidth/2,pageHeight/2,"Bienvenue", pageHeight/2);
> menu.startAngle = -90;
> menu.show();
> menu.showCaption();
>
> menu.addItem("Menu 1","toggle");
> menu.addItem("Menu 2","toggle");
> menu.addItem("Menu 3","toggle");
> menu.addItem("Menu 4","toggle");
>
>
> Votre texte ICI
> J'aimerais en fait pouvoir ouvrir les pages qui s'appelles Lien 1, lien 2, etc... en cliqant sur les libellés Lien 1, Lien 2 etc..
>
> A mon avis il faut remplacer "toggle" par une action d'ouverture de pas en les appelant, mais je connais pas la syntaxe.......
>
> MERCI d'avance de m'aider.
>
> doktr :)

Réponse 2 / 3

tominfo Messages postés 93 Date d'inscription samedi 17 mai 2003 Statut Membre Dernière intervention 30 janvier 2009
29 août 2003 à 16:10

Tu es dans un forum Java, pas JavaScript. Tu peux chercher un forum Javascript. Tu trouveras certainement ton bonheur sur Google.

> bonjour, merci de m'aider à résoudre un petit pb d'ouverture de page.
>
> j'ai inséré un menu javascript dans l'une de mes pages, et j'aimerais pouvoir accéder à une autre page (dans la même fenetre) en cliquant sur le lien...
>
> le code est le suivant (mon pb est à la fin) :
>
> <style>
> .dot {position:absolute;width:6;height:6;visibility:hidden;background-color:red;font-size:1px;z-index:100}
> .dotoff {position:absolute;width:6;height:6;visibility:hidden;background-color:gray;font-size:1px;z-index:100}
> .dotempty {position:absolute;width:6;height:6;visibility:hidden;background-color:orange;font-size:1px;zindex:100}
> .caption {position:absolute;visibility:hidden;color:black;font-size:11px;text-align:center;z-index:1}
> </style>
>
> 
> <script>
> function getObjectRef(name) {
> if(document.getElementById) return document.getElementById(name);
> else if(document.all) return document.all[name];
> else return null;
> }
> function show(name) {
> var el = getObjectRef(name);
> if(el) el.style.visibility = "visible";
> }
> function hide(name) {
> var el = getObjectRef(name);
> if(el) el.style.visibility = "hidden";
> }
> function getWidth(name) {
> var el = getObjectRef(name);
> return el.offsetWidth;
> }
> function getHeight(name) {
> var el = getObjectRef(name);
> return el.offsetHeight;
> }
> function moveMe(name,x,y) {
> var el = getObjectRef(name);> if(el) { el.style.top parseInt(y); el.style.left parseInt(x); }
> }
> function moveBy(name,x,y) {
> var el = getObjectRef(name);> if(el) { el.style.top parseInt(el.style.top) + parseInt(y); el.style.left parseInt(el.style.left) + parseInt(x);}
> }
> var menuCount = 0;
> function menuObject(name,x,y,caption, r, parent) {
> if ( (!document.getElementById&&!document.all) || navigator.userAgent.indexOf("Opera")>-1) return;
> document.write('

');
> document.write('
' + caption + '
');
> this.name = name;
> this.parent = parent
> this.ref = "divDot" + menuCount;
> this.caption = "divCap" + menuCount
> if(r) this.radius = r;
> else this.radius = 400;
> this.subMenus = new Array();
> this.state = 0;
> this.moving = false;
> if(this.parent) this.action = "null";
> else this.action = "toggle";
> if(this.parent) this.startAngle = parent.startAngle;
> else this.startAngle = 0;
> getObjectRef(this.ref).objRef = this.name;
> this.show = function() { show(this.ref); }
> this.hide = function() { hide(this.ref); }
> this.moveMe = function(x,y) { if(this.parent) { x += this.parent.x(); y += this.parent.y(); } moveMe(this.ref,x,y); }
> this.moveBy = function(x,y) { moveBy(this.ref,x,y); }
> this.x = function() { return parseInt(getObjectRef(this.ref).style.left); }
> this.y = function() { return parseInt(getObjectRef(this.ref).style.top); }
> this.w = function() { return getWidth(this.ref); }
> this.h = function() { return getHeight(this.ref); }
> this.showCaption = function() {
> moveMe(this.caption, this.x() - (getWidth(this.caption)/2) + (this.w()/2), (this.y() + this.h()));
> show(this.caption);
> }
> this.hideCaption = function() {
> hide(this.caption);
> }> this.setCaption function(c) { getObjectRef(this.caption).innerHTML c;}
> this.addItem = function(c,action,r) {
> getObjectRef(this.ref).className = "dot";
> if(!r) r = this.radius/2;
> var sub = new menuObject(this.name + ".subMenus[" + this.subMenus.length + "]",0,0,c,r,this);
> sub.parent = this;
> sub.action = action;
> sub.moveMe(0,0);
> this.subMenus[this.subMenus.length] = sub;
> return sub;
> }
> this.expand = function() {
> if(this.subMenus.length > 0) {
> var p = true;
> if(this.parent) {
> p = !this.parent.moving;
> for(var i=0; i<this.parent.subMenus.length;i++)
> p = p && ((this.parent.subMenus[i].state==0) || (this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length)) && (this.parent.subMenus[i].moving==false);
> } else var o = false;
> if((!this.parent || this.parent.state == this.parent.subMenus.length) && p) {
> if(this.parent) this.collapseAll(this.name);
> var diff = 360 / this.subMenus.length;
> for(var i=0;i<this.subMenus.length;i++){
> this.subMenus[i].moveMe(0,0);
> this.subMenus[i].show();
> this.moving = true;
> this.subMenus[i].slide(this.subMenus[i].radius * cos(degToRad((diff*i)+this.startAngle)), this.subMenus[i].radius * sin(degToRad((diff*i)+this.startAngle)), this.name + ".subMenus[" + i + "].showCaption();" + this.name + ".moving=false;" + this.name + ".state+=1;");
> }
> if(this.parent){
> getObjectRef(this.parent.ref).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.ref).className = "dotoff";
> getObjectRef(this.parent.caption).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.caption).style.MozOpacity = "33%";
> for(i=0;i<this.parent.subMenus.length;i++) {
> getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "66%";
> getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "66%";
> }
> if(this.parent.parent) {
> for(i=0;i<this.parent.parent.subMenus.length;i++) {
> getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotoff";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=33)";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "33%";
> }
> getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%";
> getObjectRef(this.parent.parent.ref).className = "dotoff";
> }}
> getObjectRef(this.ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.ref).style.MozOpacity = "66%";
> getObjectRef(this.caption).style.MozOpacity = "66%";
> }}}
> this.collapse = function() {
> var p = true;
> p = !this.moving;
> for(var i=0; i<this.subMenus.length;i++)
> p = p && (this.subMenus[i].state==0) && (this.subMenus[i].moving==false);
> if(p && this.subMenus.length > 0) {
> for(var i=0;i<this.subMenus.length;i++){
> this.subMenus[i].hideCaption();
> this.moving = true;
> this.subMenus[i].slide(0, 0, this.name + ".subMenus[" + i + "].hide();" + this.name + ".moving=false;" + this.name + ".state-=1;");
> }
> if(this.parent){
> getObjectRef(this.parent.ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.ref).style.MozOpacity = "66%";
> if(this.parent.subMenus.length != 0)
> getObjectRef(this.parent.ref).className = "dot";
> else
> getObjectRef(this.parent.ref).className = "dotempty";
> getObjectRef(this.parent.caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.caption).style.MozOpacity = "66%";
> for(i=0;i<this.parent.subMenus.length;i++) {
> getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=100)";
> getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "100%";
> if(this.parent.subMenus[i].subMenus.length != 0)
> getObjectRef(this.parent.subMenus[i].ref).className = "dot";
> else
> getObjectRef(this.parent.subMenus[i].ref).className = "dotempty";
> getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=100)";
> getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "100%";
> }
> if(this.parent.parent) {
> for(i=0;i<this.parent.parent.subMenus.length;i++) {
> getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "66%";
> if(this.parent.parent.subMenus[i].subMenus.length != 0)
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dot";
> else
> getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotempty";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)";
> getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "66%";
> }}}
> getObjectRef(this.ref).style.filter = "alpha (opacity=100)";
> getObjectRef(this.caption).style.filter = "alpha (opacity=100)";
> getObjectRef(this.ref).style.MozOpacity = "100%";
> getObjectRef(this.caption).style.MozOpacity = "100%";
> }}
> this.collapseAll = function(except) {
> for(var i=0;i<this.parent.subMenus.length;i++) {
> if(this.parent.subMenus[i].name!=except && this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length) {
> this.parent.subMenus[i].collapse();
> }}}
> this.toggle = function(e) {
> if(document.all) id = window.event.srcElement;
> else id = e.target;
> var dot = eval(id.objRef);
> if(dot.state==0 && !dot.moving) dot.expand();
> else if(dot.state==dot.subMenus.length && !dot.moving) dot.collapse()
> }
> this.doAction = function(e) {
> if(document.all) id = window.event.srcElement;
> else id = e.target;
> var dot = eval(id.objRef);
> if(dot.action == "toggle") dot.toggle(e);
> else eval(dot.action);
> }
> getObjectRef(this.ref).onmouseup = this.doAction;
> this.slide = function(xx,yy,func) {
> if(!func) func = "";
> var px = this.parent.x();
> var py = this.parent.y();
> var x = xx - this.x() + px;
> var y = yy - this.y() + py;
> var d = sqrt(square(xx-this.x() + px) + square(yy-this.y() + py));
> var v = d/8;
> if(v<1) v = 1;
> if( (Math.abs(x) < v) && (Math.abs(y) < v) ) {
> moveMe(this.ref,xx + px,yy + py);
> if(func != "") eval(func);
> } else {
> var a = round(atan(x,y));
> dx = round(v * cos(degToRad(a)));
> dy = round(v * sin(degToRad(a)));
> this.moveBy(dx,dy);
> setTimeout(this.name + ".slide(" + xx + "," + yy + ", '" + func + "');",10);
> }}
> if (menuCount==0 && document.all) document.all[this.ref].style.filter = "alpha (opacity=100)";
> menuCount++;
> return this;
> }
> var pi = Math.PI;
> function square(x) { return (x*x); }
> function sqrt(x) { return Math.sqrt(x); }
> function round(x) { return Math.round(x); }
> function rand(x,y) { return (round(Math.random()*(y-x)) + x); }
> function cos(x) { return Math.cos(x) }
> function sin(x) { return Math.sin(x) }
> function degToRad(x) { return ( x/(360/(2*pi)) ); }
> function radToDeg(x) { return ( x*(360/(2*pi)) ); }
> function atan(s,t) {
> if( s == 0.0 && t > 0.0)
> angle = 90.0;
> else if(s == 0.0 && t < 0.0)
> angle = 270.0;
> else if (s < 0.0 )
> angle = 180.0 + radToDeg(Math.atan(t/s));
> else if (s > 0.0 && t < 0.0)
> angle = 360.0 + radToDeg(Math.atan(t/s));
> else {
> if(s==0.0) s=0.00001;
> angle = radToDeg(Math.atan(t/s));
> }
> if(angle < 0.0) angle += 360.0;
> return angle;
> }
> if(document.all) pageWidth = document.body.offsetWidth-20;
> else pageWidth = innerWidth;
> if(document.all) pageHeight = document.body.offsetHeight-4;
> else pageHeight = innerHeight;
>
> // CREEZ ICI VOTRE MENU, BON COURAGE!!
> var menu = new menuObject("menu",pageWidth/2,pageHeight/2,"Bienvenue", pageHeight/2);
> menu.startAngle = -90;
> menu.show();
> menu.showCaption();
>
> menu.addItem("Menu 1","toggle");
> menu.addItem("Menu 2","toggle");
> menu.addItem("Menu 3","toggle");
> menu.addItem("Menu 4","toggle");
>
>
> Votre texte ICI
> J'aimerais en fait pouvoir ouvrir les pages qui s'appelles Lien 1, lien 2, etc... en cliqant sur les libellés Lien 1, Lien 2 etc..
>
> A mon avis il faut remplacer "toggle" par une action d'ouverture de pas en les appelant, mais je connais pas la syntaxe.......
>
> MERCI d'avance de m'aider.
>
> doktr :)

Réponse 3 / 3

benohite Messages postés 210 Date d'inscription vendredi 11 avril 2003 Statut Membre Dernière intervention 18 décembre 2003 7
29 août 2003 à 17:28

bonjour,
fr.com/ http://www.javascriptfr.com/
pour rester dans la maison ;-)

benohite
:big)

Discussions similaires

integrer une variable javascript dans un lien hypertext

Reload d'une page

exemple de page d'accueil avec la balise div et css

Formulaire de connexion et d'inscription

Vérifier si la page est un refresh

Votre réponse

Discussions similaires