begin process at 2012 05 29 19:55:47
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript et le navigateur

 > 

Autre

 > 

positionnement de bloc DIV


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

positionnement de bloc DIV

mardi 7 novembre 2006 à 22:16:20 | positionnement de bloc DIV

EvO_blue

Bonjour, voilà, disons que je suis webdesigner amateur, et j'aurais besoin de savoir s'il est possible de fixer la position d'un bloc <DIV> par rapport à l'écran à l'aide d'un code javascript. Ce que je demande est relativement simple : imaginez une image positionnée en bas à gauche de l'écran, et qui devrait rester à cette même place, même lors d'un scrolling vertical. Evidemment, le css ne m'aidant pas ici, j'ai pensé au javascript... En espérant que vous saurez m'aider...
Merci d'avance
mercredi 8 novembre 2006 à 01:38:42 | Re : positionnement de bloc DIV

Arto_8000

Voici quelque chose qui peut t'aider : function replaceDiv(id,positionX,positionY) { // positionX et positionY corresponde à la position fixe par rapport à l'écran // offsetY = (document.all) ? document.body.scrollTop : window.pageYOffset; offsetX = (document.all) ? document.body.scrollLeft : window.pageXOffset; document.getElementById("divName").style.top = positionY + offsetY; document.getElementById("divName").style.left = positionX + offsetX; } et si tu veux que cela se rafraichisse tout le temps il suffit de rajouter ceci à l'extérieur de la fonction : setInterval("replaceDiv('id',positionX,positionY)",1);
mercredi 8 novembre 2006 à 13:53:18 | Re : positionnement de bloc DIV

EvO_blue

k, je vais essayer ça et j'accepterai cette réponse si elle marche (ce qui va être le cas, je suppose ^^)
mercredi 8 novembre 2006 à 15:31:25 | Re : positionnement de bloc DIV

EvO_blue

Emm... Une autre question (je maîtrise pas encore le javascript, mais ça va venir =P) :
Si je créé mon bloc div avec ce code :
<div id = 'fixm'>...</div>

J'ai bien l'idée de ma div, mais je vois pas ce que tu appelles divName, du coup... ^^''
mercredi 8 novembre 2006 à 16:51:57 | Re : positionnement de bloc DIV

EvO_blue

En fait, je dois louper quelque chose... Encore une fois, chui nouveau dans le js, alors si quelqu'un pouvait m'expliquer ça plus en détail, svp ^^''
mercredi 8 novembre 2006 à 18:36:18 | Re : positionnement de bloc DIV

PetoleTeam

Membre Club
Réponse acceptée !
 
Bonjour...
vu l'heure tôtive... Arto_8000 à commis quelques impairs...

essaies avec ce morceau de code...

<html>
<head>
<title>TEST</title>
<script type="text/javascript">
function replaceDiv( id, positionX, positionY){
  // positionX et positionY corresponde à la position fixe par rapport à l'écran //
  offsetY = (document.all) ? document.body.scrollTop : window.pageYOffset;
  offsetX = (document.all) ? document.body.scrollLeft : window.pageXOffset;
  document.getElementById( id).style.top = positionY + offsetY +'px';
  document.getElementById( id).style.left = positionX + offsetX +'px';
  //-- pour le rafraîchissement
  setTimeout("replaceDiv('" +id+"'," +positionX +"," +positionY +")",1);
}
</script>
</head>
<body>
<div id="DIV_0" style="position:absolute">Bonjour</div>
<table height="1000" border="1"><tr><td></td></tr></table>
Bas de Page...
<script type="text/javascript">
  //-- lancement de l'action mettre en fin de document par exemple
  replaceDiv('DIV_0',200,200);
</script>
</body>
</html>


Nota :
 je prefère utiliser setTimeout plutôt que setInterval car elle n'est pas prioritaire et laisse donc le temps de faire autre chose...

;0)
mercredi 8 novembre 2006 à 23:42:49 | Re : positionnement de bloc DIV

Arto_8000

Merci de me corriger j'ai souvent tendance à faire des erreurs, mais pour l'heure je crois qu'il était pas très tard, car je suis de montréal et non de France :p Pour le setTimeout, j'ignorais la différence, mais pour moi je trouve ça plus pratique de le mettre en setInterval. Mais bon c'est une question de goût, car je ne crois pas qu'il y a une grosse différence pour les performances, s'il n'y a pas grand chose à faire rouler.
jeudi 9 novembre 2006 à 19:16:57 | Re : positionnement de bloc DIV

EvO_blue

Ca a l'air Ok
Merci à vous deux
Celà dit, j'ai trouvé une solution jouant avec du code css, ce qui est moins lourd ^^
Je garde ce code quand même, je vais en avoir besoin à coup sûr =P
jeudi 9 novembre 2006 à 19:23:49 | Re : positionnement de bloc DIV

PetoleTeam

Membre Club
B onjour...
Il me semblait bien qu'en CSS il y avait moyen de moyenner...
Si cela était un effet de ta grande bonté que de nous faire partager ta trouvaille...certains désactivent le javascript alors cela peut être très utile...

;0)
jeudi 9 novembre 2006 à 19:36:15 | Re : positionnement de bloc DIV

EvO_blue

Réponse acceptée !
Je mets ça ici, à défaut de le mettre chais-pas où =P :

----- html ---------------
<html>
[...]
<body>
<div id="fix">
contenu du bloc flottant </div>
<div id="container">
contenu de la page</div>
</body>
</html>


----- css ---------------
#fix {
     position:absolute;
     top: ordonnée de l'objet;
     left: abscisse de l'objet;
}
body>div#fixe {
    position: fixed;
}

html,body {
    margin: 0;
    padding: 0;
    overflow-y: hidden;
    height: 100%;
}

#container {
    z-index: 10;
    height: 100%;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}



Voilà, ça doit être bon (si ça ne marche pas, c'est que j'ai fait une erreur en recopiant :/)
Et si j'ai mis ça là où fallait pas, merci de me dire pour que je rectifie le tir


Cette discussion est classée dans : javascript, écran, bloc, div, positionnement


Répondre à ce message

Sujets en rapport avec ce message

Pb de positionnement d'un menu javascript [ par fred16430 ] Bonjour, j'ai créée un site en 800*600, qui se centre au milieu de l'écran automatiquement suivant la résolution des écrans. grâce au css et au div Menu Javascript et Div overflow [ par drac167 ] Bonjour tout le monde, J'ai quelques soucis actuellement sur mon site. J'ai mis un menu utilisant javacript en haut de ma page. Lorsqu'on passe sur u Optimisation javascript possible ? [ par annesirine ] Bonjour a tous,Je genere du html avec javascript par programmation, et concretement ca m'amene a faire des milliers de DIV dans lequel y tjs la meme c Positionnement [ par coockiesch ] Bonjour! :)  Je positionne un div au milieu de mon écran comme ceci:obsDiv.style.position = 'absolute';obsDiv.style.top = ( screen.availHeight - 300 ) affiche une image en javascript dans un div [ par jimmy69 ] bonjour, je debute sous javascript et j'aimerais lors du chargement d'une page web charge une image dans un div !? est ce possible ? auriez vous un capture d'écran en javascript qu'on stokerait sur le serveur [ par marinemae ] Bonjour! Je souhaiterai capturé une page web en javascript. En gros lorsque mon utilisateur valide son etatt greve, je capture ce qu'il a écran et je Récupération de valeur html avec Javascript [ par Eckmoule ] Bonjour tout le monde, Je vais tenter d'expliquer mon soucis du mieux possible. J'ai une liste de lignes comprenant plusieurs valeurs (Prix, temps, e Positionnement dynamique d'un DIV [ par jeanne38 ] Bonjour, Ma page est générée par ASP, et sa longueur peut varier selon l'utilisateur. Elle a des fleches (images) qui, quand on clique dessus, affiche Resize javascript [ par Mip ] Bonjour, je fais appel a vous pour un petit probleme.Ce code marche correctement sous firefox, le javascript est bien lance et la fonction bien appele Créer et supprimer une div avec javascript ? [ par Tiste11 ] Bonjour à tous !Alors voilà, j'essaye depuis un petit moment de créer une fonction en javascript et je bloque un peu.Pour simplifier : j'ai une div, d


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,577 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales