~*~ Puzzle  ~*~
(English version here)
 

Un clic ici pour sortir de ce frame.


Avec un petit cadeau pour vous à la fin!

Graphics created using artwork by Trina Clark

 Vous pouvez faire ce que vous voulez de votre résultat. Donnez les crédits nécessaires.


J'ai rajouté cette main pour vous aider. Vous pouvez la cliquer et la déplacer
 pour vous repérer dans le tutoriel.
Martine






Télécharger l'applet : . Télécharger le code .

L'auteur de cet applet est Virtual Max. Le site n'est plus en ligne. Dézipper les deux et les mettre dans un dossier que vous appellerez puzzle.


ETAPE 1

Créér votre image. Elle peut être aussi petite ou aussi grande que vous le voulez, et de la forme que vous voulez : soit un carré, soit un rectangle. Enregistrer en jpg ou gif.

ETAPE 2

Ouvrir une nouvelle page web.html et enregistrez avec le nom index.html.

Le mieux est ensuite de faire un tableau sur cette page index.html.

<table bgColor="#000000"  border="6" borderColorDark="#B72829" borderColorLight="#C95E5E" cellpadding="0" cellspacing="0"  width="100%">
<tr>
<td width="50%">&nbsp;</td>
<td width="50%">&nbsp;</td>
</tr>
</table>

Vous pouvez changer la couleur du fond --> bgColor="#000000", la taille de la bordure --> border="6", la couleur de la bordure foncée --> borderColorDark="#E4D8C4" et celle de la bordure claire --> borderColorLight="#b59660".
Vous ajustez la largeur de votre tableau. Là il est à 100%.

A gauche vous mettez l'image là où il y a l'espace vide/ cellule (&nbsp;) et à droite le code là où il y a l'autre espace/cellule (&nbsp;).

ETAPE 3 - Le code à ajouter dans votre tableau sur la page index. Jetons-y un coup d'oeil.

<APPLET CODE="puzzlemaker.class" WIDTH=211 HEIGHT=214>
<PARAM NAME="AUTHOR" VALUE="Virtual_Max (http://come.to/vmax)">
<PARAM NAME="IMAGE" VALUE="TrainPuzzle_mf10.gif">
<PARAM NAME="KEY" VALUE="Free Version">
<PARAM NAME="ROWS" VALUE="6">
<PARAM NAME="COLS" VALUE="8">
<PARAM NAME="BGCOLOR" VALUE="000080">
<PARAM NAME="TEXTCOLOR" VALUE="00ff00">
<PARAM NAME="TARGET" VALUE="_blank">
<PARAM NAME="LINK" VALUE="gift.html">
</APPLET>

NOM:

Description:
CODE Référence à l'applet. Et la taille de votre image avec les paramètres WIDTH=largeur et HEIGHT= hauteur)
AUTHOR Virtual_Max (http://come.to/vmax)" Paramètre obligatoire. A ne pas enlever.
IMAGE L'URL de votre image.
KEY Clé encryptée pour cet applet. Pour un usage avec lien, il y a la version gratuite. Cette version gratuite doit avoir un lien de retour au site de VMax.
ROWS Nombre de rangées. A votre choix! Plus le chiffre est grand, plus il y aura de pièces de puzzle.
COLS Nombre de colonnes. A votre choix! Plus le chiffre est grand, plus il y aura de pièces de puzzle.
BGCOLOR Couleur pour le fond et pour les messages texte. Au format hexadecimal sans #. VALUE="513D6E". Paramètres optionnels.
TEXTCOLOR
LINK L'URL de la page à ouvrir quand le puzzle a été complété. C'est une option. Ma page qui s'ouvre c'est gift.html
TARGET Target pour ouvrir un document HTML. Option. On peut utiliser les suivants: 
  • "_top"
  • "_self"
  • "_blank"
  • "_parent"
  • ou le nom de la fenêtre.
    		•

    ETAPE 4

    J'ai tout mis dans le dossier puzzle:

    • le fichier puzzlemaker.class (qui se trouvait dans le fichier zippé)
    • mon image au format .gif
    • ma page index.html avec le code Applet
    • ma deuxième page avec le petit cadeau : gift.html. Ce n'est pas obligatoire.


    Un autre résultat avec une image de forme et taille différentes et un nombre différents de rangées et colonnes.

     
     Tubes PMD

    Martine
    9 novembre 2010

    Si vous avez des questions, n'hésitez pas à me contacter.