28173 sujets

CSS et mise en forme, CSS3

Bonjour,

Je souhaite afficher une image 80x80 en bas à droite de l'écran en permanence (donc: image toujours à l'écran!) avec un lien cliquable à ouverture dans une nouvelle fenetre.(à la maniere de "too cool for ie"; pour les connaisseurs de la campagne).
Toutefois, la contrainte est que ça fonctionne avec tous (ou presque) les navigateurs. (au moins Ie, firefox, seamonkey, pour mac et linux)

C'est à insérer dans un CMS Joomla, un site statique html et un blog. Et donc je n'sais pas si il faut utiliser du javascript, css ou php (ou les 2 ou 3).

Je ne fais pas de CSS. Je croix qu'il n'est pas inapproprié de faire une requete dans ce forum de spécialistes.
Au pire, une piste de début css, au mieux LE code approprié pour afficher l'image.

Bon Web à tous
Modifié par sloyvy (14 Jun 2006 - 11:07)
Salut,

Normalement il suffit d'utiliser la {position:fixed}. Du style :

#ImageFixe {
	position: fixed;
	bottom: 0;
	right: 0:
}

Ce qui ne fonctionne malheureusement pas sur IE5/6 win (mais IE7 oui).
Il y a plusieurs alternative pour eux. Sans Javascript, il y cette méthode ou celle-là

De ton cas je te conseillerais la seconde.
Donc en gros tu utilises le code que j'ai donné ci-dessus, qui sera pour tous les navigateurs le supportant, et pour IE5/6 tu fais une feuille de style à part (ie-fixe.css par exemple) dans lequel tu mettras :

#ImageFixe {
position: absolute;
right: auto; 
bottom: auto;
left: expression( ( 0 - ImageFixe.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 - ImageFixe.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}

et tu appelles cette feuille de style via commentaire conditionnel depuis tes pages (à placer après l'appel de du fichier css normal) :
<!--[if lt IE 7]>
<link href="ie-fixe.css" rel="stylesheet" type="text/css" />
<![endif ]-->

Si tu as déjà une feuille de style pour IE tu peux l'utiliser.

A+
Modifié par Alan (14 Jun 2006 - 14:01)