Accueil » Tutoriels » JavaScript

JavaScript

Copier dans le presse-papier en JavaScript

Vous avez certainement connu ces boutons pour « Copier dans le presse-papier » utilisant pirouette en Flash pour passer outre un blocage de sécurité de nos navigateurs ? Avec l’évolution des API en JS et l’écoute de la demande des développeurs, il est possible depuis maintenant quelques temps de le faire en JS, nativement. La technique est relativement simple puisqu’elle consiste en ...

Lire la suite...

Tutoriel Javascript : Carte interactive en SVG

Carte interactive avec la librairie Raphaël-Js et le SVG

Dans ce tutoriel nous allons voir une nouvelle méthode pour créer une carte interactive en HTML / CSS et JavaScript. Le principe est d’utiliser un SVG pour dessiner la carte et détecter les zones sélectionnables. L’ancienne méthode Pour créer le même effet précédemment on utilisait une image avec une <map> pour détecter la région sélectionné. Cette méthode posait plusieurs problèmes: ...

Lire la suite...

Remplacer tous les caractères en JavaScript

La fonction split + join est plus rapide que de replace en JavaScript. Il est donc préférable d’utiliser la première méthode surtout si on doit le faire de nombreuses fois. Plus la chaine de caractères à remplacer est volumineuse, plus la différence entre les deux méthodes se creuse. var debut = +new Date; for(var i = 0; i < ...

Lire la suite...

Créer un menu sticky avec JavaScript et CSS

J’ai bossé récemment sur plusieurs sites web, et la requête d’un menu sticky était quasiment systématique. Parfois elle était justifiée, parfois je me rapprochais du contre-exemple ergonomique stéréotypé. (Dois-je utiliser un sticky menu ?) Mais quand même ! Je vous propose de voir ensemble comment on peut faire ça. Concept du menu sticky J’aime bien partir d’une idée et poser ...

Lire la suite...

Récupérer les paramètres GET d’une URL avec JavaScript

Cela peut sembler bête, mais dans la même semaine on m’a posé deux fois cette question. Dans un langage serveur, récupérer les paramètres d’une URL est vraiment super facile. Mais JS ne prévoit pas nativement cette possibilité, je vous propose donc une petite fonction pour le faire, mais il existe certainement d’autres techniques. L’exemple de PHP Lorsque des paramètres sont ...

Lire la suite...

Plugins et scripts JS pour des slideshows responsive

Après vous avoir proposé cette sélection de slideshow il y a maintenant deux ans, celle que je vous propose aujourd’hui vient compléter un nouveau besoin réel : le responsive et la prise en charge des actions au touch. Je vais vous présenter 3 outils qui se ressemblent et qui proposent tous leurs particularités. C’est devenu un vrai besoin si vous ...

Lire la suite...

Un « onresize » ou « onscroll » plus performant en JS

Si vous pratiquez couramment le JS, vous avez certainement remarqué que certains évènements sont déclenchés de manière assez ponctuelle, et d’autres peuvent être déclenchés de manière très fréquente et devenir assez difficile à gérer, c’est le cas de « onscroll » et « onresize » par exemple. Lorsque vous implémentez un écouteur d’évènement sur l’un de ces évènements (je vais prendre « onresize » pour les ...

Lire la suite...

Classe et héritage en JavaScript classique

Même sans le nouveau standard ES6, il est déjà possible en JavaScript de déclarer des classes avec constructeur et d’hériter d’autres classes.

Lire la suite...

Générer un certificat SSL autosigné

Il peut être utile de générer des certificats autosignés pour votre serveur (notamment pour l’accès à certains services qui ne nécessitent pas forcément un certificat signé par une véritable autorité de certification comme Verisign ou Thawte) : je pense à PHPMyAdmin, les consoles d’administration des sites etc.

Lire la suite...

Un Konami Code en JS vanilla ou jQuery

Vous avez certainement eu l’envie un jour de créer un konami code sur votre site web ? Comment ? Cela ne vous parle pas ? Vous savez ces petits « Easter Egg » (fonction cachée dans un programme) qui s’active après exécution d’une commande précise ? Ok, voyons cela ensemble. Vous allez me dire que ça n’a pas grand chose avec la ...

Lire la suite...