Se connecter / S'enregistrer
Votre question

Image toujours visible [resolu]

Tags :
  • Html
  • Programmation
Dernière réponse : dans Programmation
29 Janvier 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/webmaster/scripts/javascript...
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.

Autres pages sur : image visible resolu

29 Janvier 2007 13:32:16

reactualise ta console java et fais toutes les mise a jours possibles
29 Janvier 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.
Contenus similaires
29 Janvier 2007 16:16:40

Oublie le javascript et utilise les css...
XHTML
  1. <a id="fix_img_link" href="......." ></a>

  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..)
29 Janvier 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...
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