Se connecter / S'enregistrer
Votre question

Image fixe en bas à droite de la page

Tags :
  • Design
  • Programmation
Dernière réponse : dans Programmation
15 Juillet 2006 19:24:29

Bonjour.

J'espère que vous pourrez m'aider.


Je suis entrain de refaire le design de mon site internet ( simonrobic.com ) et j'ai perdu un code html que j'avais utilisé autre fois ( peut-être était-ce du javascript... ).

Ce code consistait à fixer une image dans le coin droit en bas de la page.

C'est ce que je voudrais refaire sur la nouvelle version de mon site internet.

J'ai trouvé ce code javascript :

  1. <script language="JavaScript">
  2. <!--
  3. //PLF-http://www.jejavascript.net/
  4. var hauteur=0;
  5. var temps=30;
  6. var max=30;
  7. function position(left,top,width,height,contenu) {
  8. hauteur=height;
  9. var Z="<DIV id='CalqueImage' style='position:absolute;left:"+left+"; top:"+top+";width:"+width+"; height:"+height+"'>"+contenu+"</DIV>";
  10. document.write(Z);
  11. setTimeout("Start()",temps);
  12. }
  13. function Start() {
  14. DeplacerImage("CalqueImage",Postionimage("CalqueImage"));
  15. setTimeout("Start()",temps);
  16. }
  17. function DeplacerImage(nom,top) {
  18. document.getElementById(nom).style.top = top;
  19. }
  20. function Postionimage(nom) {
  21. var pos=parseInt(document.getElementById(nom).style.top);
  22. var wintop=parseInt(document.body.scrollTop);
  23. var dispo=document.body.clientHeight;
  24. var diff=Math.ceil((pos-(wintop+dispo-hauteur)));
  25. if (diff>max) {diff=max;}
  26. if (diff<-1*max) {diff=-1*max;}
  27. var top=pos-diff;
  28. return top;
  29. }
  30. //-->
  31. </script>


A mettre entre <head> et </head>, et celui ci :

  1. <script language="JavaScript">
  2. <!--
  3. //PLF-http://www.jejavascript.net/
  4. //position(marge,1,largeur,hauteur(>H image),'image');
  5. position(10,1,100,120,'<img src="monimage.gif" width="88" height="32">');
  6. //-->
  7. </script>


à mettre après </head>.

Quels réglages effectuer pour que mon image apparaisse en bas à droite de la page, en mode fixe ? Le fait que j'ai déjà une image en background jouera-t-il ?


Merci d'avance pour votre réponse :) 


Simon.

Autres pages sur : image fixe bas droite page

15 Juillet 2006 19:52:41

Je suis pas expert en Javascript, mais ne serait-ce pas les paramètres de la fonction à modifier ? Entre les balises <body>, essayes de transformer la ligne

  1. position(10,1,100,120,'<img src="monimage.gif" width="88" height="32">');


par

  1. position(650,450,100,120,'<img src="monimage.gif" width="88" height="32">');


Si ce n'est toujours pas bien placé, tu bidouilles un peu les deux premières valeurs.

Gros bémol cependant : ça va dépendre de la résolution de l'internaute... :-(
16 Juillet 2006 09:38:40

j'ai remplacé la ligne que tu m'avais indiquée par celle que tu m'as donnée. J'ai aussi mis ces même valeurs ici :
  1. var Z="<DIV id='CalqueImage' style='position:absolute;left:"+left+"; top:"+top+";width:"+width+"; height:"+height+"'>"+contenu+"</DIV>"
à la place de left, top, width et height entre les +, car rien ne se passait en touchant juste à la ligne que tu m'avais donnée. En fesant ceci, l'image apparait bien, mais en haut à gauche ( alors que je voudrias qu'elle soit en bas à droite ), et si je change les chiffres, elle ne bouge pas...

Une idée ? :) 
Contenus similaires
17 Juillet 2006 14:09:53

J'ai pensé à un truc vraiment tout con ! Et ça marche ! Au lieu de passer par un code javascript, pourquoi ne pas utiliser une des propriétés du CSS ?

  1. <img src="ton_image.gif" style="position: fixed; top: 800px; left: 600px;"/>


Par exemple. Remarque que ça ne prend toujours pas en compte la résolution du visiteur. J'ai vu qu'en Javascript, on pouvait la récupérer (screen.width et screen.height). Vois si tu peux faire avec.
17 Juillet 2006 16:56:28

Avec cette ligne là ça marche. Cool merci beaucoup :) 
a c 145 L Programmation
17 Juillet 2006 16:58:38

A mon avis, il y a moyen de rendre le système plus "portable" en utilisant un javascript pour donner les positions du div en fonction de la taille du navigateur.
18 Juillet 2006 18:52:54

Et par css , y a pas moyen , un div en position absolue
?
Je ne l'ai pas testé ma ca pourrait etre bien plus simple.
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS