Tu connais le rollover classique, mais si on jouait un peu pour en faire un autre?

C'est très simple, tu survoles la photo pour la voir dans une taille différente, si tu veux rester dessus, clique la

Thumb correspond à l'image miniature qui sera de 75x75 px

Et grande à l'image en grand, qui sera elle de 600x700px tu peux bien entendu mettre beaucoup plus de photos, à toi de voir.

Attention toutefois à ne pas alourdir ta page !!

N'oublie cependant pas de changer les url des photos !

Le codage du HTML :

    <img

src="http://idata.over-blog.com/0/08/59/55/rollover/thumb1.jpg" class="thumb" />


src="http://idata.over-blog.com/0/08/59/55/rollover/grande1.jpg" />
</img
<a

class="pics" tabindex="1" href="#nogo"><img

src="http://idata.over-blog.com/0/08/59/55/rollover/thumb2.jpg" class="thumb" />


src="http://idata.over-blog.com/0/08/59/55/rollover/grande2.jpg" />
<a

class="pics" tabindex="1" href="#nogo"><img

src="http://idata.over-blog.com/0/08/59/55/rollover/thumb3.jpg" class="thumb" />


src="http://idata.over-blog.com/0/08/59/55/rollover/grande3.jpg" />
<a

class="pics" tabindex="1" href="#nogo"><img

src="http://idata.over-blog.com/0/08/59/55/rollover/thumb4.jpg" class="thumb" />


src="http://idata.over-blog.com/0/08/59/55/rollover/grande4.jpg" />
<a

class="pics" tabindex="1" href="#nogo"><img

src="http://idata.over-blog.com/0/08/59/55/rollover/thumb5.jpg" class="thumb" />


src="http://idata.over-blog.com/0/08/59/55/rollover/grande5.jpg" />
  </img
</a
</img
</a
</img
</a
</img
</a

Codage à mettre en bas de ton CSS

/*------rollover------*/

#container {position:relative; width:600px; height:700px; background:transparent; border:px solid #000; margin:10px auto; font-family:verdana, arial, sans-serif; font-size:12px;}

#container a.pics {float:left; padding:7px 21px; display:inline; color:#660000; text-decoration:none; width:75px; height:75px; cursor:default;}

#container a.pics img.thumb {display:block; border:1px solid #FFF;}

#container a.pics span {display:none; border:0; width:580px; background:transparent; border:1px solid #fff; text-align:center;}

#container a.pics span img {margin:10px auto; border:1px solid #CC9966}

#container a.pics:hover {white-space:normal;}

#container a.pics:hover img.thumb {border:1px solid #fff;}

#container a.pics:hover span {display:block; position:absolute; left:9px; top:192px; z-index:10; height:500px;}

#container a.pics:active img.thumb {border:1px solid #fc0;}

#container a.pics:active span {display:block; position:absolute; left:9px; top:192px; z-index:5; height:500px;}

#container a.pics:focus {outline:0;}

#container a.pics:focus img.thumb {border:1px solid #fc0}

#container a.pics:focus span {display:block; position:absolute; left:9px; top:192px; z-index:5; outline:0; height:500px;} #container span.info {clear:left; display:block; text-align:center; line-height:20px; margin:0; padding:200px 0 0 0; width:600px; text-align:center; color:#eee; z-index:1;}

#container span.info a {color:#000;}

#container span.info a:hover {text-decoration:none;}

/*---fin rollover---*/

PDF en téléchargement

Bon divertissement

Un fond et une bannière pour un blog de maman qui raconte sa grossesse ou l'après avec son bébé !
9 mois d'attente, est le nom de ce kit, un clic sur l'image pour la voir en taille réelle
Je peux vous personnaliser la bannière
PDF en téléchargement gratuit en fin d'article.
Tous mes créations sont faites à partir de kits achetés sur http://digital-crea.fr/

PDF en téléchargement gratuit

Il était une fois un forestier qui se rendait à la chasse. Tandis qu’il pénétrait dans la forêt, il entendit pleurer comme s’il s’agissait d’un petit enfant. Il avança vers les pleurs et en approchant d’un grand arbre il vit à sa cime un petit enfant.
Au pied de l’arbre, la mère s’était endormie avec son enfant reposant sur ses genoux. Un oiseau de proie les ayant aperçus, enleva l’enfant pour le déposer au sommet du grand arbre.
Le forestier grimpa au tronc, se saisit de l’enfant et le redescendit. Il pensa :
"Ramène l’enfant à la maison pour l’élever avec ton petit Lenchen."
Il le mena donc à son foyer où les deux enfants grandirent ensemble. Comme l’enfant avait été trouvé sur un arbre après avoir été enlevé par un oiseau, il fut appelé "Pierrot". Une profonde amitié liait Pierrot et Lenchen, tellement forte que lorsque l’un d’entre eux ne voyait plus l’autre, il devenait triste.
Le forestier avait une vieille servante. Un soir elle prit deux sceaux et alla puiser de l’eau à la source. Elle fit plusieurs allers et retours. La voyant, Lenchen lui dit :
- Eh, la Sanne, pourquoi transportes-tu autant d’eau ?
-Si tu ne le répètes à personne, je te le dirai.
Lenchen lui promit de ne le dire à personne ; et la servante lui confia ce qui suit :
- Demain, lorsque le forestier sera parti à la chasse, je ferai chauffer l’eau, et lorsqu’elle bouillira j’y jetterai le Pierrot pour le faire cuire.
Le matin suivant, le forestier se leva et partit à la chasse tandis que les enfants étaient encore dans leur lit.
Alors Lenchen dit à Pierrot :
- Ne me lâche pas d’un pas et je ne te lâcherai pas d’un pas non plus et Pierrot répondit :
 - Jamais au grand jamais !
Lenchen lui dit alors :
- La Sanne est allée chercher hier soir, de nombreux sceaux d’eau et je lui ai demandé pourquoi elle faisait cela. Elle m’a confié, en faisant promettre de le dire à personne, et je lui ai promis de ne le dire à personne. Elle me dit ainsi : "Demain, lorsque le père sera parti à la chasse, je remplirai le baquet que je mettrai à bouillir, puis je jetterai le Pierrot dedans pour le faire cuire. Cependant, une fois levés, habillés, nous partirons, et nous disparaîtrons.
Alors, les deux enfants se levèrent, s’habillèrent, partirent et disparurent. Comme l’eau bouillait maintenant dans le baquet, la Sanne alla dans la chambre à coucher pour attraper le Pierrot et le jeter dedans. Mais lorsqu’elle entra et se fut approché des lits, elle vit que les deux enfants étaient partis. Elle fut prise d’angoisse, en pensant à ce qu’elle pourrait bien dire au père lorsqu’il rentrera et qu’il s’apercevra de la disparition des enfants ? "
- Partons à leur recherche et essayons de les rattraper.
 La servante envoya alors trois valets à leur recherche.
Les enfants s’étaient assis à l’orée de la forêt et lorsqu’ils virent les trois valets s’approcher, Lenchen dit à Pierrot :
- Ne me lâche pas d’un pas et je ne te lâcherai pas d’un pas non plus et Pierrot répondit,
- Jamais au grand jamais !
Puis il dit :
- Change toi en branche de rosier, moi, je me change en rose !
Les trois valets arrivèrent à l’orée du bois et virent qu’il n’y avait rien qu’une branche de rosier avec une rose dessus mais d’enfant point. Ils décidèrent qu’il n’y avait décidément rien à faire ici, ils s’en retournèrent à la maison du forestier et dirent à la servante qu’ils n’avaient, le moins du monde, rien vu d’autre qu’une branche rosier et une rose. Alors la vieille servante se fendit d’une volée de bois vert envers les valets :
- Hommes sans imagination, vous auriez dû fendre la branche de rosier et couper la rose et me les ramener, disparaissez et exécutez vous !
Ils durent ainsi repartir à la recherche des enfants, mais ces derniers les avaient vus venir de loin.
Lenchen dit à Pierrot :
- Ne me lâche pas d’un pas et je ne te lâcherai pas d’un pas non plus et Pierrot répondit,
- Jamais au grand jamais !
Puis il dit :
- Change toi en église, moi dedans, je me change en couronne !
Quand les valets arrivèrent, ils ne virent rien d’autre qu’une église et dedans, une couronne.
- Que faisons nous donc ici, retournons à la maison.
Une fois revenus, la servante demanda s’il avait trouvé quelque chose. Ils dirent qu’ils n’avaient trouvé qu’une église et dedans, une couronne.
- Fous que vous êtes, pourquoi n’avez vous pas détruit l’église et me n’avez vous rapporté la couronne qui se trouvait dedans ?
Là dessus elle se dressa sur ses jambes et partit avec les trois valets à la recherche des enfants, mais ces derniers, de loin, avaient vus venir les trois valets et la servante qui les suivait en dandinant.
Lenchen dit à Pierrot :
- Ne me lâche pas d’un pas et je ne te lâcherai pas d’un pas non plus et Pierrot répondit,
- Jamais au grand jamais !
Puis il dit :
- Change toi en mare, moi je me change en canard qui nage à sa surface !
Quand la servante arriva à l’orée du bois et qu’elle vit la mare elle s’y pencha pour la vider. Mais le canard nagea à toute vitesse sur elle, de ses ailes l’attrapa par la tête et la précipita au fond. Si bien que la vieille sorcière mourut noyée.
Enfin, les enfants retournèrent le cœur joyeux chez eux ; et si aujourd’hui ils ne sont pas morts, c’est qu’ils sont toujours en vie.


Conte des Frères Grimm