La fonction suivante permet de faire un fondu entre deux images lors du passage de la souris sur l’élément #monimage Le principe : Lors du survol de #monimage dont le background est ‘image1.png’ un élément div temporaire (#temp) est créé #temp dont le background est ‘image2.png’. On affiche cet élément en fondu grâce la fonction animate de JQuery. […]
La fonction PHP suivante détermine l’état d’un répertoire : répertoire inexistant répertoire existant mais vide répertoire existant et contenant des fichiers On passe en paramètre de la fonction le chemin du répertoire.
La fonction suivante vérifie que la variable PHP $monemail est bien au format correct pour une adresse électronique. Avertissement : Je précise, au cas où que notre fonction ne vérifie pas si l’adresse mail existe ou pas !
Dans un formulaire HTML, je saisis dans une balise une valeur contenant une apostrophe, disons : A la récupération du paramètre « etat » j’obtiens : $_GET[« etat »]= « l’ouragan est passé », avec un backslash agaçant. Que faire ? Soit j’utilise la fonction stripSlashes($_GET[« etat »]) qui supprime les backslashes Soit je modifie le paramètre magic_quotes_gpc de mon fichier php.ini de WAMP. Imposer la […]
Le code suivant permet de faire défiler horizontalement ou verticalement et de façon continue un bandeau d’images. Voir le code sur CodePen Code HTML : Code javascript : Dans cet exemple les valeur d’incrémentation de distance et de temps sont celles par défaut puisque je ne les ai pas spécifiées dans les paramètres de la fonction. Vous […]
Voici une fonction JQuery qui donne un effet sympathique sur le survol d’une image, dans cet exemple, lorsque celle çi est associée à un lien .L’image est rendu légèrement transparente au survol de la souris.Alternative plus classe à l’ajout de bordure à l’image sur le hover ! Code HTML : Code JQuery : Evénement sur le survol de […]
J'ai été confrontée à un problème lors de développement d'application mobile pour androide car mon prénom, utilisé sur ma machine, comprend un caractère accentué. Le fichier avd/nomdemonAVD.ini virtuel ne peut pas se lancer correctement. La solution consiste à remplacer: target=android-15 path=C:Usersgaëlle.androidavdessai2.avd par target=android-15 path=C:UsersGALLE~1.androidavdessai2.avd
Aller sur le site de Sencha Touch et télécharger le package. Télécharger Sencha SDK Tools qui va nous permettre de faire tourner le projet dans sencha Touch Le SDK va nous génèrer l’arborescence de notre projet Installer le sdk et lancer en ligne de commande (cmd) o l’aide de cd, cd.. et dir aller sur le répertoire ou l’on a téléchargé (1er téléchargement) Sencha […]
Sur certains navigateurs IE, peu importe la version, mais dont la configuration doit vraisemblablement avoir une particularité, j'ai constaté un bug de non prise en charge des caractères unicodes tels que ⇒ ajoutés dans le DOM en javascript. Le fait d'injecter ce caractère ⇒ dans le DOM via une commande jQuery … $('#titre_tutos').html ('Blabla ⇒ […]
Voici une fonction PHP qui permet de modifier le ton d’une couleur passée en paramètre ($couleur). Si $changementTon>0 La couleur est éclaircie. Si $changementTon<0 La couleur est foncée. Modifier le ton d’une couleur
Pour récupérer en javascript le texte tapé dans l'editeur de texte WYSIWYG ckEditor, il faut utiliser la propriété getData() sur l'objet ckeditor. Afficher en javascript le contenu de l'editeur CKeditor – getData() Code HTML : <textarea name="txt1" id="texte-nouvelle" cols="120" rows="120"> mon texte par défaut </textarea> <div id="btn_apercu">Aperçu </div> Code JQuery : Déclaration de ckeditor dans […]
Les familles de font (police) suivantes ont la particularité d'avoir une largeur égale pour chaque lettre. font-family: 'Courier New', Courier, monospace;
Le code suivant permet de repérer si l’utilisateur clique à l’extérieur ou sur un élément d’identifiant ‘id_de_mon_element’. event.target correspond à l’élément qui a déclenché l’événement, où est est le paramètre passé à la fonction
Ce script javascript permet d’afficher une image de background différente selon les saisons à l’élément d’identifiant id= »monimage » L’idée est d’analyser la date courante afin de déterminer la saison en utilisant l’objet new Date(année, mois, jour)
Pour faire tourner WordPress en localhost, créez une base "NomDeMaBase" dans PHPMyAdmin, puis remplissez le fichier WP-config situé à la racine de WordPress avec les paramètres suivants : /** Nom de la base de données de WordPress. */ define('DB_NAME', 'NomDeMaBase'); /** Utilisateur de la base de données MySQL. */ define('DB_USER', 'root'); /** Mot de passe […]
En quelques petites lignes de code, voici un rond tout de CSS3 conçu, et ce sans image ! La technique utilise la propriété border-radius qui permet d’arrondir les bords d’un élément HTML. Le principe est de donner un arrondi adapté à la taille de l’élément afin de lui donner une forme parfaitement arrondie. code HTML […]
Méthode javascript pour récupérer la valeur ainsi que le texte sélectionné dans une liste déroulante (élément select HTML) Code HTML : Code Javascript : Soit une liste déroulante SELECT contenant deux items FRANCE et ITALIE, l’item ITALIE est préselectionné via l’attribut select. Nous récupérons en javascript le texte et la valeur (value) de l’item sélectionné dans la liste déroulante grâce […]
La fonction suivante renvoit la chaine $mot, passée en la nettoyant de ses accents. Les caractères accentués ayant été remplacés pour leur équivalent non accentués. Fonction pour supprimer les accents en PHP Exemple : Affiche : L’enorme elephant gris fonce mais sans accent
La fonction suivante retourne la chaîne $phrase, avec toutes les occurences du mot $mot entourées de la balise HTML <b></b> qui a pour fonction de mettre en valeur du texte (gras). On peut aussi choisir de remplacer les balises <b></b> par un <span class= »maclasse »></span>, afin de gérer le style directement dans la feuille de style CSS en paramétrant la classe .maclasse . […]
Une association entre les propriétés border:dashed, qui dessinent les bordures en pointillés et box-shadow avec une couleur identique à celle du background, permet d'obtenir un effet intéressant en faisant apparaitre une marge à l'extérieur de la bordure du div. Code HTML : <div id="bord_pointille"></div> Code CSS : #bord_pointille{ width:100px; height:100px; background:#bfd70e; border:dashed 3px #679403; border-radius:5px; […]
La fonction javascipt suivante renvoit la valeur du cookie dont le nom est passé en paramètre.Un cookie permet de stocker des variables propres à votre site sur la machine de l’internaute. Concrétement c’est un fichier texte qui contient le nom du cookie, sa valeur et sa date d’expiration. Il est stocké dans un répertoire associé au navigateur […]
Rendre le changement de couleur sur le survol de la souris plus fluide grâce à CSS3 et à la propriété transition : Survolez pour tester la modification de couleur avec CSS3 code HTML : <span id="hover_color"> Tester ici !!! </span> code CSS : #hover_color{ font-weight:bold; font-size:22px; color : #f69b00; cursor:pointer; […]
file_put_contents() est une fonction PHP bien pratique pour écrire du contenu dans un fichier. Dans l’exemple ci-dessous, elle est utilisée pour insérer la phrase « Salut‘ dans le fichier monfichier.txt ce dernier étant placé dans le répertoire du fichier d’appel (le fichier qui contient l’appel à la fonction)Important : si monfichier.txt n’existe pas il sera créé Pour en savoir […]
Si la fonction date de php vous affiche deux heures de moins (pour la France qui est en GMT+2, varie en fonction du fuseau horaire) Ouvrez dans WAMP le fichier php.ini (click sur icône de WAMP > menu PHP > php.ini), ouvrez php.ini avec un éditeur quelconque et modifiez la ligne tel que suit (au […]
La fonction javascript suivante is_int(), permet de définir si la variable « value » passée en paramètre de la fonction est de type entier ou pas.
Si l'on utilise la réécriture d'URL de WordPress (les permalinks) il n'est plus possible de récupérer dans notre template la valeur des variables d'URL par la méthode $macategorie=$_GET['cat'] par exemple ici pour les catégories. On peut néanmoins accéder à la valeur de la catégorie par : $categories = get_the_category(); $macategorie = $categories [0]->cat_ID Autre problème, […]
Petite astuce pour mettre en style un tableau HTM en affectant un background rouge uniquement aux lignes paires. Code CSS : Colore une ligne sur deux table tr:nth-child(odd){ background-color:red; }
La redirection d’une page internet, est le basculement automatique d’une adresse URL vers une autre adresse URL. Si une page a changé d’adresse, par exemple, il est important que lorsque l’internaute la cherche à l’ancienne adresse, il puisse être redirigé automatiquement sur la nouvelle. Il existe plusieurs techniques de redirection, notamment à l’aide du fichier .htacces, […]
Cette fonction PHP retourne l’URL de la page courante en la nettoyant de tous ses paramètres d’URL. En utilisant la fonction PHP explode() on sépare le début de l’URL de la partie suivant le « ? ». Si l’URL courante est : http://www.monsite.fr?page=2 la fonction renverra : http://www.monsite.fr
Ou : Comment je fais tourner le logo Memo Web (voir en-ttête de ce site) sur le passage de la souris. J'utilise, pour faire tourner un élément sur lui même en CSS, la propriétés CSS3 transition : transform, qui ne fontionne que sur les navigateurs modernes (il existe des différences dans les prises en charge entre les différents […]
not(expr) va nous permettre d’exclure une classe d’élément parmis les éléments sélectionnés dans une expression. Ici, on affecte un background à tous les éléments de classe « maclassegenerale » et qui n’ont pas la classe « maclasseaexclure » Code HTML : Code Javascript : L’image de background ne va être affectée qu’aux éléments « mon1 » et « mon3 »
not(expr) va nous permettre d'exclure une classe d'élément parmis les éléments sélectionnés dans une expression. Ici, on affecte un background à tous les éléments de classe "maclassegenerale" et qui n'ont pas la classe "maclasseaexclure" Code HTML : <div class="maclassegenerale "> mon 1</div> <div class="maclassegenerale maclasseaexclure"> mon 2</div> <div class="maclassegenerale"> mon 3</div> <div class="maclassegenerale maclasseaexclure"> mon […]
On peut ajouter un séparateur vertical (ici rouge et de 2px) qui va dinstinguer les différents éléments d'une liste HTML <li> </li> en utilisant la propriété border-left sur tous les items li de la liste, sauf le premier li { border-left: 2 px solid red; } li:first-child { border-left: none; } Une autre méthode consiste à […]
JQuery permet de calculer facilement le nombre d’éléments étant affectés d’une classe en particuler grâce à la propriété length utilisée tel que suit : la variable nb_element_de_class contient le nombre d’éléments affectés de la classe ma_classe
Pour faire des opérations en javascript avec des mesures exprimées en px comme $(« #monDiv1 »).css(‘height’) qui vaut ‘500px‘ et $(« #monDiv2_tutos »).css(‘marginTop’) qui vaut ‘200px‘ Utilisons la fonction parseInt qui va supprimer l’attribut ‘px’ de la valeur et nous permettre de faire toutes les opérations que l’on veut en utilisant les attributs de style longeur ou hauteur de nos éléments. […]
Attention, le plugin MediaEmbed qui permet de rajouter du code vidéo, récupéré de Youtube ou Vimeo, par l'intermidiaire de la barre à outil de ckeditor est un peu buggé. Ci dessous le code complet, en rouge le paramètre manquant. /* * @example An iframe-based dialog with custom button handling logics. */ ( function() { CKEDITOR.plugins.add( […]
Centrer une image horizontalement: 2 options s'offrent à nous : Appliquer au div conteneur de l'image la propriété CSS text-align: center; Ou appliquer à l'image,qui est naturellement de type inline, les propriétés display:block; et margin:auto;
Modifier en PHP l’heure ou le mois ou le jour d’une date au format SQL. Le code suivant rajoute une année, deux mois et un jour à la date $madate.
Voici différentes méthodes pour rendre impossible l'écriture dans un textarea: Déclaration du textarea en HTML : <textarea class="elementtextarea"></textarea> Rendre le textarea non editable en affectant l'attribut readonly en JQuery : $(".elementtextarea").attr('readonly','readonly'); Rendre le textarea non editable en affectant l'attribut disabled en JQuery : $(".elementtextarea").prop("disabled", true); //(valable depuis jquery 1.6 !!) équivalent de $(".elementtextarea").attr("disabled", "disabled");// évenement […]
C'est tout bête mais j'avoue avoir souvent perdu du temps avec des margin ou padding inutiles. Pour aligner du texte html verticalement avec une image, il suffit d'utiliser la propriété de style HTML vertical-align Aligner le texte avec vertical-align <img src="monimage.jpg" alt="" style="vertical-align:middle" /> Mon texte ici … Aligner le texte avec align <img src="monimage.jpg" alt="" […]
Voici un petit code javascript pour empêcher l’utilisateur de pouvoir utiliser le clic droit sur les images de votre site. Ne vous leurrez pas, il y a d’autre moyens pour l’internaute de récupérer vos images, mais cela peut quand même décourager les moins motivés. Appelez cette fonction depuis le « onload » du body :
Petit memo d’utilisation de la superglobale $_SERVER.Cette super-globale est un tableau présentant des informations envoyées par le serveur Web de votre site. C’est l’équivalent de la méthode dépréciée $HTTP_SERVER_VARS $_SERVER[« PHP_SELF »] Contient Le nom du fichier du script en cours d’exécution$_SERVER[« SCRIPT_NAME »] Contient le nom du script courant$_SERVER[« DOCUMENT_ROOT »] Contient la racine du serveur$_SERVER[« HTTP_REFERER »] Contient L’URI qui a été fourni pour […]
Erreur sur le plugin FullCalendar de JQuery qui permet de gérer un Calendrier. Firebug me renvoie le message d'erreur suivant : $("#calendar").fullCalendar is not a function Lorsque j'essaie de mettre en place le plugin … Résolution du bug : Après quelques cheveux arrachés je découvre un double appel à la bibliothèque JQuery dans ma page … source […]
Des envois de mails sous OVH laissent apparaitre, parfois, de façon aléatoire, des espaces non désirés qui coupent les mots. Embêtant … surtout lorsque le mot coupé est « &nb sp; » ou « < td> » J’ai lu dans un forum que le problème pouvait être réglé en forçant régulièrement des retours à la ligne. La mise en […]
L'ajout du caractère arobase @ devant @mysql_connect, permet de ne pas afficher les éventuelles erreurs Mysql lors de l'affichage d'une page. L'affichage de ces erreurs étant utile pour le debuggage, mais pas forcément pertinente en production, on peut configurer error_reporting dans le fichier php.ini du serveur de production afin qu'il n'affiche pas ces erreurs en […]
La position fixed n’étant pas prise en compte sous ma version de IE (apparemement ca n’est pas un cas général), j’utilise alors le underscore hack sous IE qui consiste a précéder une propriété CSS par un underscore ‘_’ , il n’y aura alors que IE pour comprendre la propriété, les autres navigateurs l’ignoreront. C’est pas […]
En javascript la fonction replace permet de remplacer une chaîne de caractère par une autre (remplacer un mot par un autre mot dans une phrase par exemple) replace (chaîne à remplacer, chaîne de remplacement) Fonction replace javascript simple Par contre cette fonction ne remplacera qu’une instance de la chaîne à remplacer. Fonction replace javascript pour remplacer toutes les […]
Il peut être utile de bien définir le type de ses variables Imposer le typage en string Imposer le typage en float
Le problème avec les fichiers CSS, ce sont leur rigidité, impossible d'utiliser des variables parametrables pour les couleurs par exemple, tout est gravé dans le marbre. Pour contourner ce problème, on peut générer à la volée un fichier CSS en PHP.L'avantage de cette méthode est de permettre l'utilisation de variables PHP qui contiendront les codes couleur, […]
La fonction htmlentities() permet de protéger l’affichage de données dont on n’est pas sûr de l’origine en rendant toutes les balises XHTML inopérentes. Exemple: http://www.monsite.com?monpseudo=<strong>Justine</strong><script src= »http://hacker.com/injection.js » > En gros, cette fonction va remplacer < par < ou > par > à l’affichage, rendant caduque toute tentative malveillante d’injection HTML (ou javascript). A l’affichage , dans l’exemple précédent, […]
