DIV QUI SUIT LE SCROLLING DE LA PAGE

Signaler
Messages postés
153
Date d'inscription
mardi 17 août 2004
Statut
Membre
Dernière intervention
23 décembre 2010
-
Messages postés
1
Date d'inscription
lundi 22 avril 2013
Statut
Membre
Dernière intervention
22 avril 2013
-
Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.

https://codes-sources.commentcamarche.net/source/44655-div-qui-suit-le-scrolling-de-la-page

Messages postés
1
Date d'inscription
lundi 22 avril 2013
Statut
Membre
Dernière intervention
22 avril 2013

petit up ^^

Merci pour le code il est génial ^^
Messages postés
745
Date d'inscription
mardi 25 mars 2003
Statut
Membre
Dernière intervention
14 juillet 2015

Super c'est exactement ce que je voulais, hm, est-il possible que le menu ne soit pas à gauche, mais un peu "centré", genre quand on élargit la page, le menu est tjrs au centre... ça serait pour mettre sur la droite d'un "cotnenu" de page qui fait 1000px de large et qui est centré dans la page web...... j'aidonc besoin que ça ne soit pas sur la gauche complètmeent..

merciiiii
Messages postés
1
Date d'inscription
lundi 18 avril 2011
Statut
Membre
Dernière intervention
19 avril 2011

Bonjour tout le monde,
je viens d'intégrer ce script à mon portfolio et je tiens a dire que c'est tout à fait ce qu'il me faut.
Mais (et oui il y a un MAIS ^^) le soucis que je rencontre, n'étant pas un codeur chevronné en java, c'est que ma div, placé sur la droite dans ma div "contenu", dépasse mon "Footer" (la dernière div de ma page) quand je scroll tout en bas et l'effet étend ma page à l'infini si je continu a scroller.
C'est surement du a la longueur de ma div...
Alors ce que j’aimerais savoir c'est:
-si c'est possible de démarrer le scroll de ma div "que" quand le haut de la page "touche" le haut de ma "div" (pas direct quand je scroll), parce-que sinon on ne voit pas la totalité du contenu, et le fait que sa scroll, on ne voit jamais le contenu qu'il y a en bas.
-si c'est possible d’arrêter le scroll quand le bas de ma div "touche" le début de mon "footer", en sachant que le contenu de ma div "contenu" à gauche de ma div "qui scroll" est variable.

C'est bon vous m'avez suivit ? ^^

Et dernière petite question:
Je voudrais savoir ou je pourrais récupérer ce script (ou équivalent) nommé "actionbar" dans le code:
http://www.elleadore.com/cote-cuisine/cote-recettes/plats/gratin-de-crozet-au-beaufort-comte-et-lardon.php
C'est la barre qui scroll sur la gauche avec les icônes.

Merci d'avance pour vos réponse.
Cordialement.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
visiblement tu as le même besoin que fiel, voir ci dessus.
Je te proposes de modifier la fonction DIV_CheckScroll comme suit
//------------------------
function DIV_CheckScroll(){
var Scroll = GetScrollPage();
var Mini = 230; /*?-ICI-?*/
//-- New position du menu
if( Scroll.top > Mini){
O_DivScroll.NewX = Scroll.left +O_DivScroll.DebX;
O_DivScroll.NewY = Scroll.top +O_DivScroll.DebY -Mini/2; /*?-ICI-?*/
}
else{
O_DivScroll.NewX = Scroll.left +O_DivScroll.DebX;
O_DivScroll.NewY = Mini;
}
//-- Si pas la bonne Position
if(( O_DivScroll.PosY != O_DivScroll.NewY)||( O_DivScroll.PosX != O_DivScroll.NewX)){
//-- Clear l'encours
clearInterval( IdTimer_1);
IdTimer_1 = setInterval("DIV_Replace(" + O_DivScroll.NewX +"," + O_DivScroll.NewY +")", 10);
}
return( true);
}
---------------------------
il est nécessaire d'ajuster les lignes ou j'ai mis /*?-ICI-?*/

;O)
Messages postés
1
Date d'inscription
dimanche 5 juin 2005
Statut
Membre
Dernière intervention
5 mars 2011

Bonjour PetoleTam,

Pourrais tu m'aider stp, j'ai ajouté le script sur mon site www.smileyemoticone.com mais je n'arrive pas à bien modifier ce qu'il faut pour que tout la pub apparaisse bien...
C'est sur la pub de droite j'en vois que la moitié...

Merci par avance

Florent
Messages postés
7
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
11 février 2011

PetoleTeam t'es au top !
Merci beaucoup. Là le code mérite largement un 10/10.

Que dieu te bénisse !
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
à l'attention de feil.
Il te faut modifier la fonction DIV_CheckScroll comme suit
//------------------------
function DIV_CheckScroll(){
  var Scroll  = GetScrollPage();
  var Mini = 230;
  //-- New position  du menu
  if( Scroll.top > Mini){
    O_DivScroll.NewX = Scroll.left +O_DivScroll.DebX;
    O_DivScroll.NewY = Scroll.top  +O_DivScroll.DebY;// -Mini;
  }
  else{
    O_DivScroll.NewX = Scroll.left +O_DivScroll.DebX;
    O_DivScroll.NewY = Mini;//Scroll.top  +O_DivScroll.DebY;  
  }  
  //-- Si pas la bonne Position
  if(( O_DivScroll.PosY != O_DivScroll.NewY)||( O_DivScroll.PosX != O_DivScroll.NewX)){
    //-- Clear l'encours
    clearInterval( IdTimer_1);
    IdTimer_1 = setInterval("DIV_Replace(" + O_DivScroll.NewX +"," + O_DivScroll.NewY +")", 10);
  }
  return( true);
}

si tu veux que la DIV reste en 0 une fois le scroll de 230px effectué alors modifiie la ligne
O_DivScroll.NewY = Scroll.top +O_DivScroll.DebY;// -Mini;
comme suit
O_DivScroll.NewY = Scroll.top +O_DivScroll.DebY -Mini;

;O)
Messages postés
7
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
11 février 2011

Position relative ou absolue pour une div qui contient tout le site c'est la même chose. Reste en relative.

Après t'as soit les margin auto gauche et droite, soit le positionnement 50% et marge gauche de -(la moitié de la largeur de ta div).

Exemple : pour une div de 900 px de largeur, positionnement gauche de 50%, relative et marge gauche de -450 px. Mais ça fout le bordel pour les petites résolutions.
Messages postés
4
Date d'inscription
jeudi 2 octobre 2008
Statut
Membre
Dernière intervention
6 février 2011

Mhhh… on dirait que j'avais oublié d'indiquer "position: relative", ça semble marcher, merci :-)

Sinon je crois qu'il y a également des façons de centrer un site avec des positions absolute (en utilisant des %).
Je me renseigne…

Il y a des jours où l'entêtement remplace l'intelligence :-)
Messages postés
4
Date d'inscription
jeudi 2 octobre 2008
Statut
Membre
Dernière intervention
6 février 2011

Merci FEIL pour ta réponse rapide.
Malheureusement, margin auto sur la balise body ne semble pas fonctionner.
Bref, je reste sans solution avec mon problème: utiliser ce script, mais dans une page qui demeure centrée…

Si le créateur du script pouvait passer par là…
Messages postés
7
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
11 février 2011

Salut,
Si tu veux que ton site soit centré dans la page, règle ta balise body (du style 900px de large, margin auto), elle remplacera ta div container. Comme ça ta div scroll ne sera pas forcément collée à un bord de ta fenêtre.

Par contre ma question reste sans réponses... peux-être qu'il n'y a pas de solutions ????
Messages postés
4
Date d'inscription
jeudi 2 octobre 2008
Statut
Membre
Dernière intervention
6 février 2011

Un peu de neuf… je viens de faire une petite manip "à la sauvage" au sein du javascript… (je précise que je ne suis PAS informaticien…).J'ai remplacé this.PosX Pos.left; par this.PosX 0;
Vraiment au feeling… et du coup, le div à scroller reste au bon endroit horizontalement sur ma page… J'imagine que ce n'est pas très orthodoxe, mais cela laisserait peut-être entrevoir la possibilité d'une solution ? (Pour info, je suis sur Mac, et non sur PC…).
Messages postés
4
Date d'inscription
jeudi 2 octobre 2008
Statut
Membre
Dernière intervention
6 février 2011

Bonjour Petole,

Merci pour ce script qui est exactement ce que je cherche.
En revanche, après avoir intégré ça au code de mon site, je comprends (un peu trop tard) que les deux logiques semblent rentrer en conflit… :-(
Je m'explique :
Je tiens à ce que le contenu de mon site reste centré dans le navigateur, quel que soit l'écran de l'internaute.
#container {position: relative; margin: 0 auto;}
Or, si j'ai bien tout saisi, le div à scroller ne peut pas être imbriqué dans un div principal et centré. Ses positions sont absolues.
Lorsque j'essaie d'intégrer ça à l'intérieur de mon div central/centré la position initiale est bonne, mais dès que je bouge quoi que ce soit, le div à scroller se met n'importe où horizontalement (ie sur le contenu principal).
Y a-t-il une solution ?
Avec mes remerciements désespérés… :-)
Messages postés
7
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
11 février 2011

OOps Petole plutôt :)
Messages postés
7
Date d'inscription
mercredi 26 septembre 2007
Statut
Membre
Dernière intervention
11 février 2011

Bonjour PeloteTeam et merci pour ce code qui va peut-être me servir !
Après quelques heures de recherches et des cheveux en moins, je viens crier à l'aide (je débute en java).
Tout fonctionne parfaitement mais j'aimerai apporter une petite modif.

Ma DIV_MOVE se situe juste en dessous du header (qui fait 230 px de hauteur).
J'aimerai que la DIV_MOVE suive le scroll uniquement au moment où le scroll est supérieur ou égal à 230 px.
En gros je veux "borner" son déplacement, qu'elle ne "descende" qu'à partir de 230 px.

Lui mettre une marge Top de 230 ne m'intéresse pas car je veux que lorsque je scroll, la div soit "collée" au Top de la fenêtre. Or quand j'ajoute une marge, il y a un blanc de 230 pixel au dessus d'elle (un peu comme dans l'exemple).

Merci d'avance,
bonne journée
Messages postés
2
Date d'inscription
lundi 20 octobre 2003
Statut
Membre
Dernière intervention
11 janvier 2011

bonsoir PetoleTeam,
merci pour la solution ça marche nickel :)

bonne continuation
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
mettre la DIV en position fixed va à l'encontre du pourquoi de cette source.
Je répète, si l'image est contenu dans la DIV elle se déplacera avec celle ci.
;O)
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

merci PetoleTeam pour la réponse

c'est le code final que je l'ai mis


mais elle ne fonctionne pas.merci d'avance.
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

je veux que l'image reste fixe comme dans http://www.africanmanager.com/articles.php alors j'ai mis cela

[# ]


mais come méme il ne fonctionne pas.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour à tous et tous mes voeux pour une bonne programmation 2011 sans oublier le reste.

A l'attention de SAIYEN
ce script est effectivement fait pour un DIV suivant le scroll de la page ce qui me semblait bien suffisant, néanmoins tu peux contourner le problème en mettant tes 2 "pub" dans le DIV_MOVE en ayant une construction du type





ensuite en jouant avec le CSS on peut les tenir chacun d'un coté de la page.
#DIV_MOVE {
position : absolute;
left : 0px;
top : 0px;
width : 100%;
}

#pub-left {
position : relative;
top : 0px;
left : 0px;
float : left;
margin-top : 10px;
margin-left : 10px;
}

#pub-right {
position : relative;
top : 0px;
right : 0px;
float : right;
margin-top : 10px;
margin-right : 10px;
}
voila, à tester et à ajuster.

A l'attention de MONI58TESTCTFG
sans la structure, et le CSS, de la page difficile de dire. Si l'image est contenu dans DIV_MOVE il n'y a aucune raison que cela ne fonctionne pas



Il te reste le forum pour poser la question et mettre le code qui va bien.

;O)
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

bonjour,
bon j'ai une probléme,je veux que ce div suit que le scrolling vertical,j'ai tout essayé mai j'ai pas trouvé des solutions,est ce qu'il y'a quelqu'un qui peut m'aider,merci d'avance.
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

bonjour,
le script fonctionne bien,mais lorsque je l'éxécute sous IE,l'image qui se trouve dans le div. sort de div,est ce que il y'a quelqu'un qui peut m'aider merci d'avance.
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

pour déplacer le div vers le droite il suffit de supprimer de fichier css left:30px et le remplacer par right:30px
Messages postés
2
Date d'inscription
lundi 20 octobre 2003
Statut
Membre
Dernière intervention
11 janvier 2011

Bonjour,

votre script est très simple et très propre ça m'aide bien pour mon site internet ...
ce que j'aimerai faire car je suis bloqué, c'est que j'ai 2 blocs div de chaque coté de mon site

pub-left et pub-right

je sais appliqué le script sur un bloc et pas sur les deux blocs div
pouvez vous svp me dire si c'est possible de faire flotter deux divs avec ce script ?

Merci et bonne année
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
il serait sympa que tu indiques la solution qui a réglée ton soucis, cela pourrait en aider d'autres.

;O)
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

cava g trouvé la solution merci petoleteam.
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

merci PetoleTeam pour votre réponse mais malheuresement, elle ne fonctionne pas
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
dans le fichier CSS il suffit de supprimer
left : 30px;
et de le remplacer par exemple par
right :30px;

;O)
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

salut, c nikel ce code mais comment je peu déplacer ce div à la droite de la page,est ce que vous pouvez m'aidez? merci
Messages postés
13
Date d'inscription
samedi 26 avril 2008
Statut
Membre
Dernière intervention
4 janvier 2011

merci beaucoup,le code fonctionne bien et il me plait mais le seul probléme que j'ai rencontré que je veux positionner ce div à droite de la page comment je le faire?
Messages postés
1
Date d'inscription
jeudi 29 mai 2003
Statut
Membre
Dernière intervention
5 août 2010

Propre et fluide, Super !!!
félicitations et merci encore...
Messages postés
2
Date d'inscription
vendredi 16 juillet 2010
Statut
Membre
Dernière intervention
20 juillet 2010

merci beaucoup, ca marche nickel !!!!! thanks !
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
dans la fonction function DIV_Deplace( x_, y_){
mets la ligne 100 en commentaire
this.Obj.style.left = parseInt(x_) +"px";
c'est cette ligne dans le fichier lu à cette adresse
http://files.codes-sources.com/fichier.aspx?id=44655&f=gf_scroll_div.js
;O)
Messages postés
2
Date d'inscription
vendredi 16 juillet 2010
Statut
Membre
Dernière intervention
20 juillet 2010

Bonjour,
J'aimerais juste savoir comment on fait pour désactiver l'effet de scrolling horizontal ????
désolé je ne fais pas de java d'habitude...
merci
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
pas de problème, mais il faudra veiller après le drag de mettre à jour les nouvelles positions.
;O)
Messages postés
1
Date d'inscription
mardi 16 septembre 2008
Statut
Membre
Dernière intervention
11 janvier 2010

Bonjour,
Est-il possible d'ajouter une fonction drag and drop à ce script ?
Messages postés
1
Date d'inscription
vendredi 14 avril 2006
Statut
Membre
Dernière intervention
15 décembre 2009

Rien à dire nickel! bravo
Messages postés
1
Date d'inscription
jeudi 13 octobre 2005
Statut
Membre
Dernière intervention
10 décembre 2009

Bonjour,
après avoir mis ce script en place, je peux dire qu'il est bien pratique. Pour déplacer les barres de menu a droit et a gauche du contenu centrale, j'ai crée un Div dans le quel j'ai placé mes deux barres. Mon seul soucis, aujourd'hui, et que le DIV remonte plus haut que la position initiale, mais pas tout le temps. Ou il descend beaucoup plus bas que la limite de l'ecran.
de plus, je souhaiterais que le DIV commence a descendre seulement lorsqu'il est en haut de l'ecran.
Messages postés
3
Date d'inscription
jeudi 28 octobre 2004
Statut
Membre
Dernière intervention
4 novembre 2012

bonjours

c'est ce que je recherche comme code, je ne comprend rien en langage informatique (javascript)

j'ai ce code mais je ne veut pas que mon menu descende, je veut qu'il monte, jusqu'à une hauteur de 10px du haut de l'écran
et qu'il reste fixe a cette hauteur de l'écran malgré la longueur du texte que j'ai pu écrire, 100 ou 1000 ligne sur la droite

<script type="text/javascript">

function depl (){
if(document.body.scrollTop>=document.getElementById('divTopLeft').offsetTop-10){
document.getElementById('divTopLeft').style.top=document.body.scrollTop
}
}
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function JSFX_FloatDiv(id, sx, sy)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
var px = document.layers ? "" : "px";
window[id + "_obj"] = el;
if(d.layers)el.style=el;el.cx el.sx sx;el.cy el.sy sy;
el.sP=function(x,y)
{
this.style.left=x+px;this.style.top=y+px;
};
el.floatIt=function()
{
var pX, pY;
pX = (this.sx >= 0) ? 0 : ns ? innerWidth :
document.documentElement && document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body.clientWidth;
pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop;
if(this.sy<0)
pY += ns ? innerHeight : document.documentElement && document.documentElement.clientHeight ?
document.documentElement.clientHeight : document.body.clientHeight;
this.cx += (pX + this.sx - this.cx)/8;
this.cy += (pY + this.sy - this.cy)/8;
this.sP(this.cx, this.cy);
setTimeout(this.id + "_obj.floatIt()", 40);
}
return el;

JSFX_FloatDiv("divTopLeft", 200,200).floatIt();
</script>
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
avec ENORMEMENT de retard...une piste
dans le CSS du bloc à mover mettre, par exemple
#DIV_MOVE {
left : 50%;
width : 400px; /* largeur du DIV */
margin-left : -200px; /* moitié de la largeur en négatif */
}
ceci assurera que le div se centre horizontalement

...concernant la partie javascript il suffit de mettre en commentaire la ligne de repositionnement en X comme suit
//---------------------------
function DIV_Deplace( x_, y_){
if( arguments[0] != null){
this.PosX = x_;
// this.Obj.style.left = parseInt(x_) +"px";
}
if( arguments[1] != null){
this.PosY = y_;
this.Obj.style.top = parseInt(y_) +"px";
}
}

;O)
Messages postés
3
Date d'inscription
mardi 3 avril 2007
Statut
Membre
Dernière intervention
11 septembre 2009

Bonjour,

Comment faire pour toujours centrer le bloc sur un page ?
(pour s'en servir de menu horizontal collé en haut de la fenêtre du navigateur)

Les css "margin-right : auto" et "margin-left : auto" ne sont d'aucun effet.

merci beaucoup
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
la on est dans une source de DIV QUI SUIT LE SCROLLING DE LA PAGE, donc normal que cela "sautille".

Visiblement ton soucis est d'avoir un DIV fixe, il te faut dans ce cas voir avec la propriété CSS
position : fixed;

Il existe sur ce site une alternative, voir la source DIV POSITION FIXED SUR LA PAGE.

;O)
Messages postés
1
Date d'inscription
jeudi 26 février 2009
Statut
Membre
Dernière intervention
27 février 2009

bravo
seulement j'ai un petit problème... j'aimerai avoir un menu réellement FIXE, connaîtriez vous une méthode pour éliminer le ""sautillement"" qui a lieu lorsqu'on scroll???
un autre script, une bidouille?
Messages postés
3
Date d'inscription
vendredi 9 novembre 2007
Statut
Membre
Dernière intervention
23 janvier 2009

ca vaut 100 pas 10 ;) bravo pour cette magnifique source !
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Sans voir cela va être difficile, mais...
Nous en arrivons donc au plus délicat
- IE et FireFox ne gérant pas de la même façon les border et les padding essaies de les mettre à zéro pour test...
- quel DOCTYPE utilises tu, un strict est préférable pour un rendu plus fidéle...

Wait and SEA
;O)
Messages postés
6
Date d'inscription
vendredi 23 janvier 2004
Statut
Membre
Dernière intervention
8 janvier 2010

merci pour ta réponse malheureusement ça n'a pas changé. je ne peux pas te donner de lien car rien d'accessible depuis l'extérieur. as-tu une autre idée ?
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
pour avoir le même effet sur les différents navigateurs il te faut mettre dans le style
body {
margin : 0;
padding : 0;
}
Les valeurs par défaut des navigateurs n'étant pas les mêmes.

Tiens moi au courant, voir donnes moi un lien pour me rendre compte.

;O)
Messages postés
6
Date d'inscription
vendredi 23 janvier 2004
Statut
Membre
Dernière intervention
8 janvier 2010

la source fonctionne bien mais j'ai deux problèmes :
le premier mineur : la div qui bouge est placée dans une grande div avec une autre à sa gauche, sans le javascript, il n'y a pas d'espace entre les div, avec oui.
le second beaucoup + bloquant : sous firefox, ma div qui bouge se retrouve supperposée à celle de gauche et non plus à côté comme dans ie.
une idée ?
Messages postés
1
Date d'inscription
mardi 17 mai 2005
Statut
Membre
Dernière intervention
25 décembre 2008

super!!!
Messages postés
11
Date d'inscription
dimanche 25 septembre 2005
Statut
Membre
Dernière intervention
6 décembre 2008

Merci pour cette source.
Elle est vraiment super efficace et facile à modifier, c'est tout à fait ce que je cherchais.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,

Si tu déclares des positions de départ dans ta feuille de style en px aucun problème de positionnement n'est à craindre et ce quelque soit la résolution.

Si tu déclares la position en % la position dépendra effectivement de la largeur de ta page donc de la résolution de l'affichage du PC hôte.

;O)
Messages postés
1
Date d'inscription
lundi 17 septembre 2007
Statut
Membre
Dernière intervention
20 novembre 2008

Bonjour et merci pour ce code!
Une question : à différentes résolution d'écran, le div se place à différents endroit (au niveau horizontal). Comment puis je faire pour l'avoir au même endroit de ma page, quelle que soit la résolution de l'écran?
Merci encore!
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
Si j'ai bien compris, le DIV apparaît sur un click et tu veux qu'il soit déjà positionné lorsque celui ci est affiché, puis qu'il suive le scroll de la page lorsque visible.

1/ rétablir le fichier gf_scroll_div.js comme à l'origine
2/ dans la fonction d'affichage il faut forcer le DIV à se positionner à la bonne position
3/ cela nous donne par exemple le fichier test suivant

<html>
<head>
<title>[PetoleTeam] Test...</title>
<style type="text/css">
body {
height : 2000px;
width : 2000px;
}
#DIV_MOVE {
left : 550px;
top : 350px;
color : #000000;
font-size : 13px;
font-family : Verdana;
text-align : center;
background-color : #b0c4de;
height : 150px;
width : 130px;
border-style : solid;
border-width : 1px;
border-color : #ffffff #808080 #808080 #ffffff;
z-index : 1000;
visibility : hidden; /* IMPORTANT pas display :none */
}
</style>
<script type="text/javascript" src="gf_scroll_div.js"></script>
<script type="text/javascript">
//-------------
function Swap(){
//-- Recup ref. de l'objet
var Obj = O_DivScroll.Obj;
//-- Mets en position de fin de deplacement
O_DivScroll.Move( O_DivScroll.NewX, O_DivScroll.NewY);
//--------------------------------------------------------------//
// IMPORTANT on joue avec style.visibility et non style.display //
//--------------------------------------------------------------//
if( Obj.style.visibility == 'hidden')
Obj.style.visibility = 'visible';
else
Obj.style.visibility = 'hidden';
}
</script>
</head>

L'objet qui suit

</html>

C'est la fonction Swap qui ce charge de le mettre à la bonne position avant affichage.

Nota :
- Le onclick dans l'exemple est mis sur le BODY, mais peut s'adapter à d'autre élément.
- On utilise les propriétés O_DivScroll.NewX et O_DivScroll.NewY pour placer le DIV en position finale aprés scroll.
- On utilise style.visibility et non display car la fonction de récupération de la position, telqu'utilisée ne peut récupérer les valeurs si l'objet est en display :none.

Voila j'espère avoir été aussi clair que possible

;O)
Messages postés
2
Date d'inscription
lundi 28 novembre 2005
Statut
Membre
Dernière intervention
14 novembre 2008

Bonjour merci pour la reponse.

En fait je fait apparaitre une div via une liste de liens qui apparaissent selon une liste dynamique. donc je ne sais pas ou on est dans la page a ce moment la. Donc j'ai ajouté ton code a ma div pour qu'elle apparaisse la ou on est dans la page mais le probleme est qu'elle n'apparait pas immédiatement sur ma page mais quand par exemple je fait un scroll. Alors que je voudrais qu'elle apparaisse immédiatement. (je ne sais pas si je suis bien claire) Merci
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
Perso je ferai plutôt
return({top:Top+350, left:Left+550});
pour n'avoir qu'un seul endroit ou changer éventuellement...

Je ne saisi pas ton problème "...et pas au clic..."

;O)
Messages postés
2
Date d'inscription
lundi 28 novembre 2005
Statut
Membre
Dernière intervention
14 novembre 2008

Bonjour,

très bon code. une question
Je positionne ma div au milieu de ma page en modifiant cette fonction

function GetScrollPage(){
var Left;
var Top;
var DocRef;

if( window.innerWidth){
with( window){
Left = 550+pageXOffset;
Top = 350+pageYOffset;
}
}
else{ // Cas Explorer a part
if( document.documentElement && document.documentElement.clientWidth)
DocRef = document.documentElement;
else
DocRef = document.body;

with( DocRef){
Left = 550+scrollLeft;
Top = 350+scrollTop;
}
}
return({top:Top, left:Left});
}
mais le problème est que la div n'apparait qu'au premier scroll de la souris et pas au clic. Si vous avez une solution merci
Messages postés
2
Date d'inscription
lundi 4 avril 2005
Statut
Membre
Dernière intervention
7 novembre 2008

merci beaucoup pour ses infos. bonne journée
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
Tout ce joue dans le fichier gf_scroll_div.js

modifie la ligne 77
var Rapport = 1.0/20.0; // On divise par 20

en mettant par exemple
var Rapport = 1.0/1.0;

le DIV se repositionnera tout de suite, plus le chiffre du diviseur est important plus le déplacement est lent.

Voilou...
;O)
Messages postés
2
Date d'inscription
lundi 4 avril 2005
Statut
Membre
Dernière intervention
7 novembre 2008

bonjour,
je voudrais savoir ou se trouve les paramètres pour modifier l'effet du menu.
En gros j'aimerais qu'il n'y est pas cette sorte de delay sur le menu mais qu'il soit plus actif rapidement quand on déplace le scroll.
merci
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Re,
Si tu as un lien pour récupérer ta page et ton code, à l'occasion je peux y jeter un oeil...
;0)
Messages postés
2
Date d'inscription
mardi 23 septembre 2008
Statut
Membre
Dernière intervention
3 octobre 2008

Bonjour,
J'ai teste la duplication pour avoir deux div scrollable horizontale et n'ai finalement pas reussi.. Merci quand meme d'avoir jeté un oeuil a mon post..

A tt
Messages postés
14
Date d'inscription
jeudi 17 juin 2004
Statut
Membre
Dernière intervention
16 septembre 2010

Bonjour,
J'ai testé deux div en scroll l'un horizontal, l'autre vertical => en synthèse aucun problème pour paramétrer les deux JS (et oui, on configure l'un en scroll horizont. et un second en Vertical, sachant que les div doivent dans les Js porter des noms différents ! idem dans le code de la page !).
Cependant les deux div en question se retrouvent de fait en position relative donc leurs positionnements reste complexes ( risque de chevauchement, de superposition malgré un z-index mentionné ou égal,...).
Pour ma part j'ai du me résoudre à abandonner le fait d'utiliser deux fois cet excellent code source au sein d'une même page (trop de problème de positionnement sous IE et Firefox).
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
I'm SORRY but le code ne le permet pas dans sa forme actuelle.
Tu peux toujours essayer en dupliquant les lignes de sources.

Very navred
;0)
Messages postés
2
Date d'inscription
mardi 23 septembre 2008
Statut
Membre
Dernière intervention
3 octobre 2008

Bonjour,

Je voudrais utiliser ton script mais sur 2 menu disposer de chaque coté d'un contenu centrale..

Quelqu'un aurait il quelque piste pour que cela fonctionne?
Pour l'instant j'arrive a n'en faire bouger qu'un, l'autre venant se superposer sur le premier.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,
Le DIV retrouve la place qu'il a à l'ouverture de la page, si il est au milieu il y retournera, en fait ce sont les positions left et top qui sont reprise, donc si on agrandi la fenêtre le milieu ne sera pas restitué.
Tu peux dans ce cas revoir le script en calculant la position à atteindre et ce en tenant compte de la fenêtre active.
;O)
Messages postés
14
Date d'inscription
jeudi 17 juin 2004
Statut
Membre
Dernière intervention
16 septembre 2010

re-bonjour solution trouvée pour le scroll vertical cependant juste là une question de positionnement, où paramètres-tu la position de ton div: si tu souhaite par exemple que ton div_move soit toujours calé au milieu de ta page ?
Messages postés
14
Date d'inscription
jeudi 17 juin 2004
Statut
Membre
Dernière intervention
16 septembre 2010

bonjour et merci pour ce script :
juste une petite question, est-il possible de déasctiver le scroll vertical et si oui de quelle manière ?
Messages postés
1
Date d'inscription
vendredi 12 octobre 2007
Statut
Membre
Dernière intervention
21 juillet 2008

Nickel !
Le truc intégré en 2s et fonctionne du 1er coup, merci :)
Messages postés
29
Date d'inscription
mardi 27 avril 2004
Statut
Membre
Dernière intervention
16 mai 2009

Salut PCPT,
Pour ce qui est de lâcher du lest, ce ne sera pas possible. Par contre, j'essaierai ce soir depuis mon poste perso.
Merci pour l'info, d'autant plus que ce n'est pas la première fois...
A+
Messages postés
13280
Date d'inscription
lundi 13 décembre 2004
Statut
Modérateur
Dernière intervention
3 février 2018
34
salut,
pat84 -> tu passes sans doute par un firewall d'entreprise qui n'accepte pas cette compression.
vois avec l'administrateur pour laisser du leste, ou télécharge la source d'un autre poste ;)

++
PCPT [AFCK]
Messages postés
29
Date d'inscription
mardi 27 avril 2004
Statut
Membre
Dernière intervention
16 mai 2009

Bonjour à tous,
Le téléchargement du fichier me renvoie ceci depuis ma plate-forme de sécurité :
"Le fichier javascriptfr_DIV-SUIT-SCROLLING-PAGE___Page.zip contient le virus Compressed_Huge_File: ce fichier a été détruit."

It's a shame !
PAB.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,

Je n'ai pas IE7, et sans plus d'info difficile de répondre, peut être un problème de placement initial.

Si tu avais un lien pour voir si il s'agit d'une contrariété due à IE7.
;O)
Messages postés
3
Date d'inscription
mardi 20 décembre 2005
Statut
Membre
Dernière intervention
19 février 2008

Bonjours et un grand merci pour ton code, cependant j'ai un petit problème, sur firefox cela marche, mais sous IE7 ma div se trouve en plein milieu de la page mais sa fonctionne quand même.Comment faire pour que ma div soi bien placée.Merci d'avance
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
34
... quand t'ajoutes un commentaire, t'as une CASE A COCHER pour etre avertis !!!

"Etre averti par email lorsqu'un nouveau commentaire est ajouté sur cette source"

si tu la coches la premiere fois, t'es inscrit sur une liste que tu peux gerer en cliquant sur les liens que je t'ai indique plus haut, ca y est, suffit de lire !!!
Messages postés
1
Date d'inscription
vendredi 2 novembre 2007
Statut
Membre
Dernière intervention
12 décembre 2007

Bonjour à tous,
salut coucou 747,j'ai regarder mais je ne voie rien qui pourrias mamené sur un truc concret qui enfin ferme ses mail ou le compte,donc je renouvelle,Message aux admin,fermer mon compte ou arrêter ces émails a répètitions que de 1 je n'ai pas demander,de 2 ses pas cocher dans mon compte,de 3,l'url que vous mettez dans vos mail pour soit disans arrter ses émail ne mène nul part.
Donc j'ai pas fini de venir je pense,se qui deviens embêtant pour les autres membres,mais je n'ai aucun retour de votre part,donc je continue jusqu'a bannissement ou fermeture de mon compte,(enfin,compte!!!mdrrrr,si ont peu dire,pour les membres,désolés,aurevoir à tous.
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
34
clique sur mon compte, parametrer, et la tu vois un truc au sujet des adresses mails
Messages postés
1
Date d'inscription
samedi 2 juin 2007
Statut
Membre
Dernière intervention
11 décembre 2007

Bonjour à tous,
Je m'y reprend pour la 2 èmes fois.
J'ai déja demander comment stoper cette envahissement d'émail??
Comme j'ai dis la première fois,je pensais être tomber sur un site raisonnable,je voie que se n'est pas le cas!!!
Je ferais remarquer que sur mon compte aucune,je dis bien aucune options pour recevoir des émail n'est cochées.
Le lien que vous mettez a chaque émail envoyer pour se désabonner de ces émail a répétition ne mène nul part vu que je n'ai rien de cocher
J'aimerais avoir des nouvelles pour stoper desuite tous ces émail qui ne sont plus a la semaine la.
Merci de stoper ses émail et même se compte si il fallait passer par la pour en stoper avec cela,merci
Messages postés
3
Date d'inscription
dimanche 31 juillet 2005
Statut
Membre
Dernière intervention
4 février 2011

Bonjour,
Est-il possible de centrer horizontalement le div sur la page quelque soit la taille
de celle-ci?
Merci d'avance.
Messages postés
631
Date d'inscription
samedi 28 septembre 2002
Statut
Membre
Dernière intervention
18 mai 2009
3
Même si ce genre de widget fait, à mon goût, un peu trop 'old school', le code a le mérite d'être propre, fonctionnel et bien implémenté.

Have fun
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
13
Bonjour,

A l'attention de kiki2sirom
Merci pour l'info sur Orca Browser, mais apparement c'est le moteur Gecko qui est utilisé donc normalement compatible.

A l'attention de coucou747
Le but ici n'est pas de fixer un div mais de le faire revenir à la même place après un scroll de page.
Concernant le position : fixed, j'ai d'ailleurs, il y a peu proposé, une source,
DIV POSITION FIXED SUR LA PAGE http://www.javascriptfr.com/code.aspx?ID=43444
pour palier au manque de IE en espérant également que IE en version 7 corrigerait son manque.

A l'attention de alover971
Je suis tout à fait d'accord avec toi pour la longueur du code mais je privilégie souvent la réutilisation des fonctions ce qui explique, de plus certains effets, pour petit qu'il soit, requirent souvent plus de code que l'on ne le souhaite.
Penses à mettre en ligne tes sources cela peut intéresser du monde.

Merci à tous
;0)
Messages postés
127
Date d'inscription
lundi 7 avril 2003
Statut
Membre
Dernière intervention
6 mars 2009

Ben oui, c'est propre, çà marche au poil, bravo et merci
Kenavo
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
34
apparement depuis MSIE7 si, conclusion, les dernieres versions des 4 grands navigateurs webs le gerent... (Khtml et ses forks, MSIE, opera, gecko)
Messages postés
8
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
30 novembre 2007

Bon bien fait et commenter..
Pour ma part je trouve tout de meme le code ultra long et lourd pour un si petit effet :)
avec deux fois moins de codes je fais des actualités defilante avec 4effet possibles :/
mais bon :) bien quand meme !
Messages postés
8
Date d'inscription
samedi 25 février 2006
Statut
Membre
Dernière intervention
30 novembre 2007

Oui coucou747.. le position: fixed ne fonctionne sur quasiment aucun navigateur !
donc met ta solution a la trappe..
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
34
quelquechose a ajouter ?
Messages postés
7
Date d'inscription
vendredi 23 décembre 2005
Statut
Membre
Dernière intervention
9 novembre 2007

J'en vois pas l'utiliter pour mon site, mais bien coder, compact, Expliquer/ Commenter. 8 pour le fun. je le garde dans un coin si un jours j'en ai besoin ;).
Messages postés
153
Date d'inscription
mardi 17 août 2004
Statut
Membre
Dernière intervention
23 décembre 2010

veni vidi vici : je suis venu, j'ai vu, je suis convaincu...

nickel chrome ?!?!
note : 9, juste pour histoire de pas mettre 10
quoi dire d'autre... sinon que ça marche aussi avec Orca Browser

kiki