Une image en bas a droite

je souhaite mettre une image en bas a droite de notre site a la http://soutenir.framasoft.org/

la seule que j'ai trouvé est ceci mais a priori cela ne fonctionne pas l'image reste en haut a gauche

<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>
</head>

<script language="JavaScript">
<!--
//PLF-http://www.jejavascript.net/
//position(marge,1,largeur,hauteur(>H image),'image');
position(1,1,1,200, '<a href="http:///"><img src="../squelettes/images/don.png" TITLE="Faire un Don" /></a>');
//-->
</script>

avez vous un truc dans votre besace :wink:

assobachant a écrit :

je souhaite mettre une image en bas a droite de notre site a la http://soutenir.framasoft.org/

ca se fait pas en css ca ?
(http://www.nanoum.net/blog/6_absolue_et_fixe.html)

2010/1/7 Stephane <stephane@rezo.net>:

assobachant a écrit :

je souhaite mettre une image en bas a droite de notre site a la
http://soutenir.framasoft.org/

ca se fait pas en css ca ?
(http://www.nanoum.net/blog/6_absolue_et_fixe.html)

En tous cas , c'est en css que framasoft l'à fait:

/* faire un don */

a#donation {
  position: fixed;
  right: 0;
  bottom: 0;
  display: block;
  height: 63px;
  width: 63px;
  background: url(/framanav/make-a-donation.gif) bottom right no-repeat;
  text-indent: -999em;
  text-decoration: none;
}
a#donation:hover {
   filter:alpha(opacity=80);
   -moz-opacity:0.8;
   -khtml-opacity: 0.8;
   opacity: 0.8;
}

C'est le position fixed qui fait le tout.

Par contre ,c'est uniquement sur des navigateurs respectueux. :slight_smile:

Denis Chenu a écrit :

2010/1/7 Stephane <stephane@rezo.net>:
  

assobachant a écrit :
    

je souhaite mettre une image en bas a droite de notre site a la
http://soutenir.framasoft.org/
      

On doit aussi pouvoir mettre une image en background sur le body et la positionner en bas a droite... mais des fois c est un peu plus complique.
Ca donne ca :

html{
height:100%;
}
body
{
height:100%;
background-image:url(image);
background-position:100% 100%;
background-repeat:no-repeat;
}

triton

_______________________________________________

merci pour les réponses et je vais regardé ça ............

Bon je lit ça su sarka :

    L’autre évolution importante concerne le fichier css perso.css qui
    devient perso.css.html permettant ainsi d’utiliser les balises SPIP,
    par exemple, pour ne plus se préoccuper du chemin des images ou
    utiliser les variables de configuration.

si je ne m’abuse je créer donc /squelettes/css un fichier perso.css et c’est dans celui la que je fait mes modif.

si dans mon perso.css j’écrit :

|/* faire un don */

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

n’aurait je pas du avoir mon image s’afficher en bas a droite ?

J’ai du commettre une erreur mais ou ?

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

Bonsoir,
tu définies un selecteur a#donation dans ta css mais tu utilises un div#donation dans ton html...
<a id="donation"></a> dans ton html devrait faire quelque chose, reste a voir quoi....
triton

Le 8 janvier 2010 20:31, assobachant <asso.bachant@laposte.net> a écrit :

Bon je lit ça su sarka :

L’autre évolution importante concerne le fichier css perso.css qui
devient perso.css.html permettant ainsi d’utiliser les balises SPIP,
par exemple, pour ne plus se préoccuper du chemin des images ou
utiliser les variables de configuration.

si je ne m’abuse je créer donc /squelettes/css un fichier perso.css et c’est
dans celui la que je fait mes modif.

As-tu rajouté dans inc-head.html
<link href="[(#CHEMIN{css/perso.css}|direction_css)]" type="text/css" /> ?

--
@plus

Jacques

Pour les lyonnais++ spip-lyon@rezo.net http://spip-party.net/-Lyon-

assobachant a écrit :

Bon je lit ça su sarka :

   L’autre évolution importante concerne le fichier css perso.css qui
   devient perso.css.html permettant ainsi d’utiliser les balises SPIP,
   par exemple, pour ne plus se préoccuper du chemin des images ou
   utiliser les variables de configuration.

si je ne m’abuse je créer donc /squelettes/css un fichier perso.css et c’est dans celui la que je fait mes modif.

tu viens d'écrire "perso.css qui devient perso.css.html" non ?

si dans mon perso.css j’écrit :

|/* faire un don */

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

n’aurait je pas du avoir mon image s’afficher en bas a droite ?

J’ai du commettre une erreur mais ou ?

ben si tu mets pas de lien dans ton div ...

Le 08/01/2010 21:28, Jean-Christophe Villeneuve a écrit :

assobachant a écrit :

Bon je lit ça su sarka :

   L’autre évolution importante concerne le fichier css perso.css qui
   devient perso.css.html permettant ainsi d’utiliser les balises SPIP,
   par exemple, pour ne plus se préoccuper du chemin des images ou
   utiliser les variables de configuration.

si je ne m’abuse je créer donc /squelettes/css un fichier perso.css et c’est dans celui la que je fait mes modif.

tu viens d'écrire "perso.css qui devient perso.css.html" non ?

Si sarkaspip ne reprend que perso.css.html, ca serait bête et ca demanderait à être corrigé.
AMHA

si dans mon perso.css j’écrit :

|/* faire un don */

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

n’aurait je pas du avoir mon image s’afficher en bas a droite ?

J’ai du commettre une erreur mais ou ?

ben si tu mets pas de lien dans ton div ...

Je dirais même plus :
<a id="donation"></a>
Sinon, tu peut mettre div#donation dans ta css perso.

triton a écrit :

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

Bonsoir,
tu définies un selecteur a#donation dans ta css mais tu utilises un div#donation dans ton html...
<a id="donation"></a> dans ton html devrait faire quelque chose, reste a voir quoi....
triton

ben c'est pil poil ce que je souhaite ,reste plus qu'a faire en sorte que lorsque je clic sur l'image ça m'ouvre un lien vers un article;

j'ai essayé plusieurs truc mais sans succés une idée m'a derniere tentative été <a id="<a href="0">donation"></a>

bon allez au boulot ............

assobachant a écrit :

triton a écrit :

a#donation {
position: fixed;
right: 0;
bottom: 0;
display: block;
height: 63px;
width: 63px;
background: url(../squelettes/images/don.png) bottom right no-repeat;
text-indent: -999em;
text-decoration: none;
}
a#donation:hover {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}|

et que dans mon fichier /squelettes/noisettes/pied/ inc_pied_copyright.html

a la fin : <div id="donation"></div>

Bonsoir,
tu définies un selecteur a#donation dans ta css mais tu utilises un div#donation dans ton html...
<a id="donation"></a> dans ton html devrait faire quelque chose, reste a voir quoi....
triton

ben c'est pil poil ce que je souhaite ,reste plus qu'a faire en sorte que lorsque je clic sur l'image ça m'ouvre un lien vers un article;

j'ai essayé plusieurs truc mais sans succés une idée m'a derniere tentative été <a id="<a href="0">donation"></a>

bon allez au boulot ............
_______________________________________________

un flash est passé

<a href="http://" id="donation">Faire un don</a>

Merci pour lae coup de main Denis Chenu, triton sans oublié Jean-Christophe, Stephane, Jacques