Faire un calendrier de l'avent virtuel
Sylvie
-
zazzz -
zazzz -
Bonjour,
Je voudrais donc faire un calendrier de l'avent virtuel pour mon fils.
Je voudrais mettre cette image en fond:
Je voudrais donc faire un calendrier de l'avent virtuel pour mon fils.
Je voudrais mettre cette image en fond:
' target='_blank' rel='nofollow'>http://hyperimages.fr/images/calendrierfond.png</code>
Et donc mettre des cases qui, que quand on clique dessus, a me redirige vers une image.
Comment faire?
Pouvez vous me donner un code?
Merci
2 réponses
-
tiens j'ai fait ça :
http://pastebin.com/K29nWMWA
il ne reste plus qu'à ajouter les liens pour chaques jour du mois !
j'ai mis des exemples pour le jour 1 et 2 .
pour le jour 3 par exemple
<a href="" class="cadre"> 3 </a>
pour rajouter l'image : http://www.babelio.com/users/QUIZ_Lucky-Luke_4727.jpeg
tu fais
<a href=" http://www.babelio.com/users/QUIZ_Lucky-Luke_4727.jpeg" class="cadre"> 3 </a>
ainsi de suite pour tout les jours -
bonjour le calendrier est super parcontre je n'arrive pas a faire en sorte que les jours soit vérouillé pour ne pas qu'il y ai de triche .... comment puis je arriver a faire cela ?
j'ai crue comprendre que je devais utiliser :
//-- Recup Today
var ToDay = new Date();
var Jour = ToDay.getDate();
var Mois = ToDay.getMonth();
var Annee = ToDay.getFullYear();
//-- Test entre les dates
if( (ToDay > D_Mini) && (ToDay < D_Maxi)){
alert( 'Bon');
}
else{
alert( 'Mauvais');
}
mais je ne sait pas ni ou ni quant ni comment le rajouter
j'ai fais un essais voici mes lignes de texte mais je ne sait pas ou rajouter ces lignes la (les images n'ont pas d'url parce que j'utilise un éditeur (nvu) qui les prends sur mon post.)
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=UTF-8">
<title>Calendrier de l'avent 2013 !!</title>
<style type="text/css">
body{
background:url('fond.JPG') no-repeat top center;
background-size:100%;
}
div#calendrier{
width:736px;
height:400px;
background:url('boutons.JPG') no-repeat top center;
position: absolute;
left:25%;
top:20%;
}
.cadre{
width:80px;
height: 80px;
border:1px black solid;
margin-top:10px;
margin-left: 5px;
margin-right: 5px;
float:left;
text-decoration: none;
color:black;
font-size:2em;
}
.cadre:hover{
background:url('http://image.noelshack.com/fichiers/2012/49/1354924744-mario-question-block.jpg');
color:red;
}
</style>
</head>
<body>
style="text-align: center; z-index: 1; top: 184px; height: 100px; left: 326px; width: 745px;"
id="calendrier"><a style="color: rgb(31, 31, 0);" href="1.pdf"
class="cadre">22
</a><a style="color: rgb(31, 31, 0);" href="2.pdf"
class="cadre">23
</a><a style="color: rgb(31, 31, 0);" href="3.pdf"
class="cadre">24
</a><a style="color: rgb(31, 31, 0);" href="4.pdf"
center="" class="cadre">25
</a><a style="color: rgb(31, 31, 0);" href="5.pdf"
class="cadre">26
</a><a style="color: rgb(31, 31, 0);" href="6.pdf"
class="cadre">27
</a><a style="color: rgb(31, 31, 0);" href="7.pdf"
class="cadre">28
</a><a target="_blank" href="8.pdf" class="cadre"><span
style="color: rgb(31, 31, 0);">29</span>
</a></div>
</body>
</html>
