Javascript | Le pingouin de l'Oise

Javascript

2019

25 mai

Une carte Open Street Map

Afficher une carte Open Street Map (OSM) avec un marqueur géolocalisé sur votre site vous permettra de personnaliser votre page de contact. Très largement inspiré du blog Communication & Transformation Numériques des Territoires, voici la marche à suivre pour l’intégrer dans votre blog statique Hugo. J’ai déjà expliqué la démarche pour un affichage de Google Maps, comment afficher …

lire la suite

2017

30 janvier

Un texte défilant

Faire défiler un texte dans un bandeau, on utilisait la balise <marquee> ; elle est désormais obsolète et doit être remplacée par la balise <canvas>. Déplacement d’un texte dans un bandeau avec canvas Fonctionnement Il faut utiliser un script simple pour le défilement : les explications sont dans les commentaires. Le script <script> var canevas = …

lire la suite

24 janvier

Rafraîchir une iframe

Il est parfois utile de rafraîchir une <iframe> dans une page web. Cela permet par exemple de recentrer une Google Maps après avoir affiché une infobulle. Dans l’exemple, je vais placer un bouton juste au dessus de l’<iframe> pour la recharger. Créer le bouton Une classe reload_iframe est déclarée pour le css <div class="reload_iframe"><input …

lire la suite

8 janvier

Scroll to top

Une flèche qui permet un retour “haut de page”, assez pratique pour les articles longs. Elle permet un accès rapide au menu, sans avoir à utiliser la molette de la souris.

lire la suite

7 janvier

Une lightbox simple en CSS

L’effet lightbox permet d’afficher des images, du contenu, des pages au premier plan d’une page Web sans avoir à quitter la page. Il assombrit le reste de la page et met en évidence le contenu en surbrillance. Utilisons un shortcode Il faut composer un fichier lightbox.html dans le répertoire layouts/shortcodes de votre thème. Lightbox.html <a href="#{{ .Get "href" }}"> …

lire la suite

© 2018 - 90v3Z - L3 P1n90U1n - Propulsé par Hugo