[Javascript] objects+scroll
Felix
bruno.lanciau at cnes.fr
Mon Jul 22 05:35:21 CDT 2002
<HTML>
<HEAD>
<TITLE></TITLE>
<!--
ATTENTION N'oublie pas de mettre les fichiers correspondants sur la meme
directorie
Dans fontes.css j'ai mis un type de fontes (rouges, 8px de haut, etc...) que
tu peux
modifier comme tu le souhaites
-->
<LINK REL=stylesheet TYPE="text/css" HREF="fontes.css" TITLE="style">
</HEAD>
<BODY onResize="window.location.href = window.location.href;">
<SCRIPT LANGUAGE="JavaScript">
var doc; // (différent selon Netscape ou MSIE)
var sty; // (différent selon Netscape ou MSIE)
var htm; // html (différent selon Netscape ou MSIE)
var lg; // largeur du cadre
var ht; // hauteur du cadre
var h; // position bord haut
var g; // position bord gauche
/*
je commente succinctement le code au fur et a mesure pour que tu puisses
t'en dépétrer mais
si tu as des problemes le mieux est que tu viennes me poser les questions
*/
function test()
{alert("test");}
/*
Cette partie contient les fonctions de calcul de taille et de positionnement
de ton layer
*/
function DonneTaille()
{
largeur_voulue=parseInt(cadre.dimension.largeur / 2);
eval(doc +'boite'+sty+'.width='+largeur_voulue);
eval(doc +'boite'+sty+'.clip.height='+50);
eval(doc +'defile'+sty+'.width='+largeur_voulue);
eval(doc +'defile'+sty+'.visibility="visible"');
bord_gauche=parseInt((cadre.dimension.largeur -
largeur_voulue)/2);//pour centrer ton calque
eval(doc +'boite'+sty+'.left='+bord_gauche);
eval(doc +'defile'+sty+'.left='+0);
bord_superieur=parseInt(cadre.dimension.hauteur - 80);
var haut=bord_superieur;
var gauche= bord_gauche;
var droite= gauche+largeur_voulue;
var bas= bord_superieur+50;
eval(doc +'boite'+sty+'.height=50');
eval(doc +'boite'+sty+'.top='+bord_superieur);
// eval(doc+ 'boite' +sty+ '.clip="rect(' +haut+ ','+droite+ ','
+bas+ ',' +gauche+ ')"');
eval(doc +'boite'+sty+'.visibility="visible"');
}
/*
Cette partie de code sera générique, elle te permettra de t'adresser aussi
bien a Netscape (sauf v6)
qu'a MSIE . elle te permet aussi de récupérer les dimensions du cadre utile
du client pour pouvoir mettre ton layer
en place . (pour plus d'explication sur ce code va voir
http://www.ifrance.com/Chez-Felix/DHTML/DHTML_L2.htm)
*/
function DIMENSIONS(lg,ht)
{
this.largeur = lg;
this.hauteur = ht;
}
function POSITIONS(h,g)
{
this.haut = h;
this.gauche = g;
}
function LE_CADRE(p_dimension,p_position)
{
this.dimension = p_dimension;
this.position = p_position;
}
Netscape = (document.layers)? true:false;
MSIE = (document.all)?true:false;
if(Netscape)
{
doc = "document.";
sty = "";
htm = ".document";
lg = window.innerWidth - 15;
ht = window.innerHeight - 132;
h = window.screenX;
g = window.screenY;
}
if(MSIE)
{
doc = "document.all.";
sty = ".style";
htm = "";
lg = document.body.clientWidth;
ht = document.body.clientHeight;
h = window.screenLeft;
g = window.screenTop;
}
dimension = new DIMENSIONS(lg,ht);
position = new POSITIONS(h,g);
cadre = new LE_CADRE(dimension,position);
// Pour accéder aux propriétés de cadre
message0 = "dimensions ="+ cadre.dimension.largeur + "x" +
cadre.dimension.hauteur+"\n et";
message = message0 + "\nposition = "+ cadre.position.haut +
"x" + cadre.position.gauche;
// alert(message);
function demarreScroll( spd, loop)
{
loop = true;
scrolltimer = null;
var page = eval(doc +'defile'+sty);
var y_pos = parseInt(page.top);
if (loop == true)
{
page.top = (y_pos - 1);
eval('quelle_hauteur='+ doc +'defile'+'.scrollHeight');
eval('ou_est_top='+ doc +'defile'+sty+'.top');
ou_est_fin = parseInt(quelle_hauteur)+parseInt(ou_est_top);
if(ou_est_fin<= 0)
{
eval("document.all.defile.style.top="+5);
}
scrolltimer = setTimeout("demarreScroll(1)", 50);//pour modifier
la vitesse tu changes le dernier parametre
}
}
function stopScroll()
{
loop = false;
clearTimeout(scrolltimer);
}
</script>
<DIV ID="boite" STYLE="position: absolute; top: 10px; left 10px; width:
500px; height: 45px; z-index:1 ;clip:rect(0,600,50,0) ; visibility:hidden;
">
<DIV ID="defile" STYLE="position: absolute; top: 5px; left 0px; width:
500px; height:100 ; z-index: 2;
visibility:visible;background-image:'http://www.ifrance.com/Chez-Felix/image
s/mykitty.gif';
layer-background-image:'http://www.ifrance.com/Chez-Felix/images/mykitty.gif
'">
<FONT CLASS="calqueDefile">
<!--************************************************************************
********************************************-->
<!--METS TON TEXTE : ATTENTION !!!!!!!!!!!!!!!!<BR> chaque retour forcé a
la ligne se fait par <BR> !
<BR>-->
<BR>
Exemple:<BR>
Au sein de la Division Carrieres et Compétences vous aurez pour mission,<BR>
- d'assurer la parution hebdomadaire de "Trajectoires" sur Intranet, en
relation étroite avec chacun des centres et dans une large autonomie<BR>
- d'assurer l'actualisation réguliere sur Intranet de la base de données
"Organigramme " et "Décisions de nomination et organisation" du CNES<BR>
- d'apporter un support aux autres activités et/ou aux projets conduits dans
la division, tels que : Revue des Carrieres et des Compétences, Répertoire
des Métiers, Management de la mobilité, Diapason (volet RH), .<BR>
<BR>
Motivé(e) par la gestion des ressources humaines, de niveau bac + 2 <BR>
vous disposez d'une solide maîtrise de la micro-informatique et de
l'inter/intranet. Ce poste requiert : sens de l'efficacité opérationnelle,
capacité d'adaptation, souci de la qualité, esprit d'équipe et
discrétion.<BR>
<!--************************************************************************
********************************************-->
<BR>
</DIV>
</FONT>
</DIV>
<FORM>
<INPUT type="button" value="Démarrer"
onclick="javascript:demarreScroll('1','true');"><BR>
<INPUT type="button" value=" Arreter "
onclick="javascript:stopScroll();"><BR>
</FORM>
<SCRIPT LANGUAGE="JavaScript">
DonneTaille();
demarreScroll('1','true');
</script>
</BODY>
</HTML>
A+
Félix
bruno.lanciau at cnes.fr
http://www.ifrance.com/Chez-Felix/
More information about the Javascript
mailing list
