Tutoriel : Php | Catégorie : Scripts | Ecrit par pcleder le 22/03

Transcription

Tutoriel : Php | Catégorie : Scripts | Ecrit par pcleder le 22/03
Tutoriel : Php | Catégorie : Scripts | Ecrit par pcleder le 22/03/2010 à 19:18:02
Lien url : http://webdezign.tutoriaux.free.fr/Tutoriaux.php?categorie=Php&Souscategorie=Scripts&page=87
Toute reproduction totale ou partielle de ce fichier est interdit ! © 2017 Webdezign.tutoriaux.free.fr Tous droits réservés
Php : Produire un effet de reflet sur vos textes
Votre page doit être liée à la dernière version de jQuery (jquery-1.4.2.js)
Si ce n’est pas le cas, vous pouvez télécharger ce fichier sur :
http://api.jquery.com/
Ensuite, placez le code suivant entre les balises <head></head> :
<script type="text/javascript" src="jquery-1.4.2.js"></script>
Effectuez la même procédure pour le fichier suivant :
http://www.patrickcleder.com/reflet.js
Ce dernier comprend les fonctions de reflet. Placez également ce fichier à la racine de votre site :
http://www.patrickcleder.com/verdana.gdf
Il s’agit d’une police de caractère de type GD Font pour PHP.
- HTML &amp; jQuery
Collez ce code dans l’éditeur de votre choix et enregistrez le avec une extension de type .html ou .php à la racine de
votre site :
<!doctype html>
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<!--Lien à jQuery -->
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<!--Lien au fichier générant le reflet -->
<script type="text/javascript" src="reflet.js"></script>
<!--Style general de la page -->
<style>
body {font:14px verdana, sans-serif;background:#000000;color:#C0C0C0;font-weight:bold;}
</style>
<script type="text/javascript">
//Méthode évitant le conflit avec d’éventuels plugins jQuery lies sur cette même page
jQuery.noConflict();
jQuery(function(){
//Evénement sur le clic du bouton de la page
jQuery("#creation").click(function(){
//Suppression de tous les éléments contenus dans la div "demo"
jQuery("#demo").empty();
//La page implémente l’effet de reflet à tous les éléments appartenant à la classe "reflet". Le setTimeout permet de
laisser le temps au serveur de créer l’image.
setTimeout("ajoutReflet();",500);
//Ajout d’une image dans la div "demo"
//La source de cette image est créée à la volée via un appel à la page createImage.php (Voir script de la page plus bas
avec un passage de paramètre correspondant au contenu de la zone de saisie.
jQuery("#demo").append
Page 1
('<img id="img1" src="createImage.php?texte=' + document.getElementById("texte").value +