Image toujours visible [resolu] - Programmation
TomsGuide.com : 700 000 inscrits répondent à toutes vos questions high-tech et informatique.
Pour obtenir de l'aide, inscrivez-vous gratuitement !
 

Ajouter une réponse



Mot :   Pseudo :  
 
Bas de page
Auteur
 Sujet : Image toujours visible [resolu]
 
lfabr
Profil : IDNaute
Plus d'informations
n°91938
29-01-2007 à 02:11:37

Bonjour,

Tout d'abord, afin de vous éclairer sur mon niveau, je vous dirais que mes connaissances sont très "rase-motte" en html et javascript et je suis certain qu'il existe des choses relatives au domaine des pages web dont je ne soupçonne même pas l'existence...
Bref, voici ce qui m'amène: je souhaiterais ajouter sur ma page html archiclassique ( http://www.starmoteurs.com/qspon.htm ) une image, associée à un lien hypertexte qui resterait toujours visible, même en cas de défilement.
Je ne souhaite pas utiliser la technique des frames car il paraît que pour le référencement, ce n'est pas génial.
J'ai essayé plusieurs techniques javascript que j'ai glanées deci delà (par exemple là: http://www.mandragore2.net/webmast [...] rs_visible
ou là: http://www.croixsens.net/script/imagevue.html )

mais j'ai beau avoir essayé une dizaine de fois en m'appliquant et même en partant d'une page quasi vierge, rien à faire, ça ne marche pas.

Si vous pouviez m'aider, je vous en serais très reconnaissant. Je précise que ma préférence (mais ai-je le droit d'être exigeant?...) va à la technique exposée dans le premier exemple ci-dessus, car apparemment, il n'y a pas de ré-affichage. D'après ce que j'ai compris, ce serait une image de fond. En plus, j'ai vu cette technique fonctionner sous Firefox. Or, il me semble avoir lu quelque part que la deuxième technique ne fonctionnait que sous IE.

Merci par avance pour votre aide.


Message édité par lfabr le 29-01-2007 à 17:24:39
Liens sponsorisés


Inscrivez-vous ou connectez-vous pour masquer ceci.

dansulivann
Profil : IDNaute
Plus d'informations
n°91967
29-01-2007 à 13:32:16

reactualise ta console java et fais toutes les mise a jours possibles

lfabr
Profil : IDNaute
Plus d'informations
n°91974
29-01-2007 à 16:05:30

mais les procédures sont en Javacript qui ne sont pas liées à Java donc je ne vois pas ce que ça fera de plus. Par ailleurs, j ai déjà vu les procédures fonctionner sur d'autres pages avec mon environnement actuel. Donc, je ne pense pas que ce que tu me proposes me fasse progresser.
Merci quand même.

MoOx_t
On rigole bien ici!
Profil : IDNaute
Plus d'informations
n°91978
29-01-2007 à 16:16:40

Oublie le javascript et utilise les css...
XHTML

Code :
  1. <a id="fix_img_link" href="......." ></a>


Code :
  1. #fix_img_link {
  2.     display: block;
  3.     position: fixed;
  4.     top: 0px;
  5.     left: 0px;
  6.     background: url(urldelimage) no-repeat;
  7.     width: 150px; /* Largeur de l'image */
  8.     height: 150px; /* Hauteur de l'image */
  9. }



Ca marchera sous firefox, opera, et ie7 il me semble... la propriété css position: fixed ne marche pas sous ie6 il me semble (mais en cherchant un peu sur le net, tu trouvera une solution à ce petit problème..)


---------------
Programmeur n.m : Celui qui résout un problème que vous n'aviez pas, d'une façon que vous ne comprenez pas.
lfabr
Profil : IDNaute
Plus d'informations
n°91983
29-01-2007 à 17:20:19

Merci de vos conseils. J'ai finalement trouvé, mais pas en appliquant l'exemple qui m'a été donné. Il m'a néanmoins été très utile en me parlant des feuilles CSS (quand je vous disais qu'il y avait des choses dont je ne soupçonnais même pas l'existence...)
Donc j'ai trouvé un exemple qui a l'air de fonctionner tout navigateur. Je vous donne l'adresse ci-après:
http://batraciens.net/css-astuces/zone-fixe-1.htm

et le code corespondant à enregistrer tel quel via notepad par exemple (je n'écris ça que pour des personnes qui seraient confrontées au même problème mais bien sûr pas pour tous les experrts du site qui se sont gentiment penchés sur mon problème):

<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<style type="text/css">

/* début du hack "fixed" permettant de fixer le menu fixe sous IE */
body { /* redéfini les propriétés de toute la page */
overflow-y: hidden ; /* fonction microsoft supprimant les ascenseurs sous IE */
margin: 0; /* la marge du body est à 0 pixels */
padding:0} /* marge intérieure à 0 pixels */
html > body {overflow-y: auto} /* annule le overflow-y pour firefox 1.5 et supérieur */

.content { /* boite prenant toute la page sauf le menu fixe*/
height: 100%; /* la hauteur de la boite occupe 100% de l'écran */
overflow: auto} /* on rajoute un ascenseur droit à la boite */
/* fin du hack "fixed" permettant de fixer le menu fixe sous IE */

.menu1 { /* menu fixe en bas de l'écran */
position: absolute ; /* position du menu = par rapport à la boite parent (ici le body) */
bottom: 0 ; /* Le bas du menu est à 0 pixels du bas de l'écran */
left: 0 ; /* La gauche du menu est à 0 pixels du bas de l'écran */
width: 98% ; /* largeur du menu = 98% de l'écran */
height: 20px ; /* hauteur du menu = 20 pixels */
background-color : red ; /* la couleur du menu */
border-top: solid black 1px} /* Bordure haute du menu */

body>.menu1 {position:fixed} /* annule le hack "fixed" pour les autres navigateurs que IE */

.boite {width:20% ; height:800px ; border:2px solid black} /* boite servant à faire défiler l'écran, en débordant de la page */

</style>
</head>

<body>

<div class="menu1"> <!-- menu fixe en bas de l'écran -->
Contenu du menu
</div>

<div class="content"> <!-- début du contenu de la page -->
<div class="boite">Contenu quelconque de la page</div>
</div> <!-- fin du contenu de la page -->

</body>
</html>

Merci encore...


Message édité par lfabr le 29-01-2007 à 17:24:17

  FORUM Infos-du-Net » Programmation » Image toujours visible [resolu]

Aller à :
Ajouter une réponse
 

Plan du forum
Forum MesDiscussions.Net, Version 2007.1.2
© 2000-2007 No1Dev
Page générée en 0,288 secondes
Liens