Tom's Guide > Forum > Programmation > Image fixe en bas à droite de la page

Image fixe en bas à droite de la page

Forum Programmation : Image fixe en bas à droite de la page

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !

Contenu relatif

Voir tous les sujets correspondants à "image fixe droite page"

Créer un nouveau sujet Répondre

Bas de page Chercher dans ce sujet

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 :

Code :

<script language="JavaScript">
<!--
//PLF-http://www.jejavascript.net/
var hauteur=0;
var temps=30;
var max=30;
function position(left,top,width,height,contenu) {
hauteur=height;
var Z="<DIV id='CalqueImage' style='position:absolute;left:"+left+"; top:"+top+";width:"+width+"; height:"+height+"'>"+contenu+"</DIV>";
document.write(Z);
setTimeout("Start()",temps);
}
function Start() {
DeplacerImage("CalqueImage",Postionimage("CalqueImage" ));
setTimeout("Start()",temps);
}
function DeplacerImage(nom,top) {
document.getElementById(nom).style.top = top;
}
function Postionimage(nom) {
var pos=parseInt(document.getElementById(nom).style.top);
var wintop=parseInt(document.body.scrollTop);
var dispo=document.body.clientHeight;
var diff=Math.ceil((pos-(wintop+dispo-hauteur)));
if (diff>max) {diff=max;}
if (diff<-1*max) {diff=-1*max;}
var top=pos-diff;
return top;
}
//-->
</script>

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

Code :

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

Répondre

Inscrivez-vous ou connectez-vous pour masquer ceci.

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

Code :

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

par

Code :

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... :-(

Répondre à Sethpolma

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 :

Code :

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 ?

Répondre à shYm0n

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 ?

Code :

<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.

Répondre à Sethpolma

Avec cette ligne là ça marche. Cool merci beaucoup

Répondre à shYm0n

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.

Répondre à crazycat@idn

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.

Répondre à DIgItaL_ReaM

Créer un nouveau sujet Répondre

Tom's Guide > Forum > Programmation > Image fixe en bas à droite de la page

Aller à :

Aide |
Règles du forum

Il y a 1962 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Page générée en 0,396 secondes

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler

Liens