public marks

PUBLIC MARKS from decembre with tags tutoriel & code

2020

🛠 CHROME - LOADED from FIREFOX ADDON - Linkify Plus Plus

(via)
This extension can be installed on Chrome. However, it is not hosted on Chrome Webstore. You have to download the source code and load the extension as an unpacked extension. Download and extract the ZIP file. Navigate to chrome://extensions/. Enable "Developer mode". Click "LOAD UNPACKED" button and select the extension folder that is previously extracted. Other explanation: https://developer.chrome.com/extensions/getstarted#manifest

SVGvs GITHUB - Why SVG Image Hosting is Hard (and how to do it for free)

Github also has a thing called ‘Gists’. Gists are designed for sharing small code samples of whatever you like. If you create a free Github account, you can add new gists to your account whenever you like. They’re 100% free. The interesting thing about gists is we don’t even have to be logged in to create one. If you open this page, paste in some text in, give it a filename and hit ‘Add file‘, you’ll have a publicly-accessible URL to an anonymous file. Of course, it’s probably easier to keep track of your files if you just create a free GitHub account from the start, but you don’t have to to try it out. How to Host your SVG in a GitHub Gist

2018

JAVASCRIPT - REGEX - Les expressions régulières (partie 2/2) - Dynamisez vos sites web avec JavaScript ! - OpenClassrooms

(via)
Dans ce deuxième chapitre consacré aux regex, nous allons voir leur utilisation au sein du JavaScript. En effet, le premier chapitre n'était là que pour enseigner la base de la syntaxe alors que, une fois couplées à un langage de programmation, les regex deviennent très utiles. En JavaScript, elles utilisent l'objet RegExp et permettent de faire tout ce que l'on attend d'une regex : rechercher un terme, le capturer, le remplacer, etc.

2017

FIR - DEV - Éxaminer et modifier le code HTML - Outils de développement | MDN

Recherche: À partir de Firefox 45, la boite de recherche de l'Inspecteur trouve les correspondances dans tout le markup du document ouvert, ainsi que dans toutes les frames. Pour commencer une recherche, il suffit de cliquer sur la boîte de recherche pour l'agrandir ou bien d'utiliser les raccourcis clavier Ctrl + F , ou Cmd + F sous Mac. Lors de la saisie, une pop-up d'autocomplétion affiche toutes les classes ou ID qui correspondent à la recherche en cours :

CSS + STYLUS - Stylus et les préprocesseurs CSS (en guise d’introduction) · Les intégristes

(via)
Première question : qu’est-ce qu’un préprocesseur ? Un préprocesseur est un programme qui procède à des transformations sur un code source, avant l’étape de traduction proprement dite (compilation ou interprétation). source Wikipedia. Dans le cas d’un préprocesseur CSS la syntaxe simplifiée ou enrichie en entrée est analysée et compilée en un langage que nous connaissons tous et que nous utilisons au quotidien : CSS.

CSS - Conserver le ratio 16/9 des images fullscreen et vidéos - Alsacreations

Le but est ici de faire en sorte que l'image de fond que l'on aura placée en CSS conserve son ratio de 16/9 et prenne toute la taille du navigateur, quelle que soit la taille de ce dernier (aka fullscreen). Pratique quand on fait du responsive. Voici le code utilisé : .ratio { background: url("monimage.jpg") no-repeat; background-size: cover; width: 100vw; height: 56.25vw; } Concrètement ce que l'on fait : on donne à l'image la largeur du navigateur grâce à l'unite vw (viewport-width) on lui donne la hauteur à laquelle on a appliqué un ratio 16:9 calculé en faisant 100 * 9 / 16 de la largeur du navigateur

CSS - the new code - FullScreen HTML5 Video In Pure CSS

by 1 other
To make the video fullscreen: video#bgvid { position: fixed; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -100; -ms-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background: url(polina.jpg) no-repeat; background-size: cover; } Conclusion: “Background” video can be a very powerful feature on a site, but with great power comes great responsibility: please use such features judiciously.

2015

jQuery - TUTO - Le sélecteur jQuery - débuter en jQuery

$ : le sélecteur raccourci __ Encore une petite précision : dans mon extrait de code ci-dessus, vous voyez que j'ai ajouté un paramètre $ pour ma fonction anonyme, et que j'ai ensuite utilisé $() à la place de jQuery().__En fait, $() est un alias de la fonction jQuery() (un autre nom pour la même fonction), on l'utilise plus souvent que jQuery(), tout simplement parce que c'est plus court à écrire ! __ Le seul problème est que d'autres framework javascript (Mootools nottament) utilisent également $ comme raccourci, du coup si vous utilisez plusieurs frameworks sur la même page, il y aura des conflits. ___ Heureusement, jQuery propose un mode noConflict(). Dans ce mode, le raccourci $ n'est pas créé pour éviter les problèmes. Le mode noConflict est par exemple activé par défaut dans Wordpress, donc $ ne marche pas et il faut donc se rabattre sur jQuery() à la place, la loose -_-'. __ L'astuce que j'ai utilisée me permet d'utiliser $ comme raccourci SEULEMENT à l'intérieur de ma fonction anonyme. Comme ça, même sous Wordpress où le mode noConflict est activé, je pourrais utiliser $ à l'intérieur de mon jQuery(document).ready.

JQuery - Native equivalents of jQuery functions

by 1 other (via)
I think there are many developers who don’t realize that most of the jQuery methods they use have native equivalents that require the same or only a slighter larger amount of code to use. Below are a series of code samples showing some popular jQuery functions along with their native counterparts.

2014

GM - MPIV (Mouseuver Popup Image Viewer) : Host Rules How-To

You can make MPIV work with more sites by adding your own host rules. You don't need to edit the source code for this. Instead, you paste the rule into MPIV's settings dialog which is accessible from your script manager's toolbar icon menu, e g. "User Script Commands" → "Set up Mouseover Popup Image Viewer" for Greasemonkey users.

2013

CSS - VALEUR LIMITES (padding-bottom / margin-bottom) - - Colonnes de même hauteur - revisité - A la recherche du seul vrai Disposition

Attention cependant, les navigateurs ne permettent pas de jeter des valeurs arbitrairement grandes sur eux. Ils ont des limites. Dépasser cette limite et les colonnes se développeront à la valeur padding-bottom et vous finirez avec de très longues pages. Heureusement, nous connaissons cette limite (par Safari; le plus conservateur à ce sujet): 32767px. Cela devrait suffire pour la plupart des cas (se sentir si libre d'utiliser une valeur inférieure) et des rendements nous code comme ceci: # Block_1, # block_2, # block_3 { padding-bottom: 32767px; margin-bottom:-32767px; } # Wrapper { overflow: hidden; }

CSS - A Couple of Use Cases for Calc() | CSS-Tricks

calc() is a native CSS way to do simple math right in CSS as a replacement for any length value (or pretty much any number value). It has four simple math operators: add (+), subtract (-), multiply (*), and divide (/). Being able to do math in code is nice and a welcome addition to a language that is fairly number heavy. But is it useful? I've strained my brain in the past trying to think of obviously useful cases. There definitely are some though.

DEV CSS - Tutoriel vidéo HTML-CSS : Firebug, L’extension pour les développeurs Web | Grafikart.fr

Firebug est une extension firefox incontournable pour tous les intégrateurs et développeurs web. Elle permet entre autre de voir comment le navigateur interprète les différents languages et permet aussi d’interagir en temps réel avec le code source. Plutôt que des longues explication une petite vidéo vous aidera à mieux comprendre comment firebug peux changer votre façon de débugger vos pages web

2010

Les Expressions Régulières - Rationnelles - Regex - Regexp sur ExpRegpour chaque fonction, d'une multitude d'exemples simples, qui se compliqueront par la suite, pour en arriver à des structures assez élaborées.

REGEX qui est une contraction de l'anglais Regular expression traduit en français par Expressions régulières, mais aussi Expressions rationnelles Qu'est ce qu'une expression régulière ? TROUVER (retrouver ==> coupler ==> assortir) des MOTIFS (pattern ==> profils ==> masques ==> structures) et de TRAITER (récupérer ==> extraire ==> remplacer) des éléments à l'intérieur d'un chaîne de caractères. On commence par déterminer le motif de ce que l'on cherche avant d'en appliquer le traitement souhaité grâce aux fonctions fournies par PHP. # Pour vous aider dans la compréhension de ce formidable outil, le cours sera agrémenté, Qu'est ce que je peux faire avec une expression régulière ? On peut tout faire avec une expression régulière... rien ne semble impossible en effet !.

unsafeWindow - Injecting JS functions into the page from a Greasemonkey script on Chrome - Stack Overflow

I have a Greasemonkey script that works just fine in Firefox and Opera. I struggle with getting it to work in Chrome, however. The problem is injecting a function into the page that can be invoked by code from the page. Here's what I'm doing so far: First, I get a helper reference to the unsafeWindow for Firefox. This allows me to have the same code for FF and Opera (and Chrome, I thought).

2009

Tour de Flex, components, samples | Adobe Developer Connection

Tour de Flex component explorer Tour de Flex is a desktop application for exploring Flex capabilities and resources, including the core Flex components, Adobe AIR, data integration, and a variety of third-party components, effects, skins, and more. Tour de Flex has three primary goals: * Provide non-Flex developers with an overview of what is possible in Flex in a "look and see" environment * Provide Flex developers with an illustrated reference tool * Provide commercial and non-commercial Flex developers with a place to showcase their work

Regular Expressions - Popular Tools, Utilities and Programming Languages That Support Regular Expressions - Specialized Tools and Utilities for Working with Regular Expressions - TutorialTools & LanguagesExamplesBooks & Reference

These tools and utilities have regular expressions as the core of their functionality. grep - The utility from the UNIX world that first made regular expressions popular PowerGREP - Next generation grep for Microsoft Windows RegexBuddy - Learn, create, understand, test, use and save regular expressions. RegexBuddy makes working with regular expressions easier than ever before. General Applications with Notable Support for Regular Expressions There are a lot of applications these days that support regular expressions in one way or another, enhancing certain part of their functionality. But certain applications stand out from the crowd by implementing a full-featured Perl-style regular expression flavor and allowing regular expressions to be used instead of literal search terms throughout the application. EditPad Pro - Convenient text editor with a powerful regex-based search and replace feature, as well as regex-based customizable syntax coloring.

C'est quoi le card sharing ??? - DZSAT

1ére explication : le card sharing c'est par exemple sur les 9000 ng4 : il faut au minimum 2 personnes qui ont le meme matos dont un qui a une carte off et que les 2 pc sont relies a internet et nedrosat ( en creant un serveur virtuel ).nedro recupere les cles en temps reel provenant de la personne qui une carte off et les transmet aux personnes qui n'ont qu'un demo ( de meme marque ).cela permet de faire profiter du bouquait a plusieurs personnes ( j'ai entendu dire que cela marchait j'usqu'a 6 personnes sans freezes ) mais je n'est pas encore teste 2éme explication : le serveur,a des cartes officielles et aussi peut mettre en partage des émulateurs comme le fichier tps.bin, les codes pour les suisses et les taquillas... le sharing se fait via une connexion internet en effet les codes s'envoient via internet et arrivent directement dans la machine désignée en effet le card sharing ne fonctionne pas avec tous les démos !

2008

Firefox Web Developer Toolbar | Webmaster Tips

Web Developer Toolbar is one of the most useful tools you can have for web design. This is a short introduction that will show you some ways that you can use it when making web sites.

Create the Ultimate Firefox Web Development Profile :: the How-To Geek

by 1 other
Firefox configured with a separate profile just for web development, let's take a look at the extensions we can use to make Firefox into the ultimate web development tool. Must-Have Web Dev Extensions : These are all extensions that I use on a regular basis for web development. Firebug Web Developer Extension Aardvark Extension Colorzilla View Source With

ThickBox 3.1___A webpage UI dialog widget written in JavaScript on top of the jQuery library.

by 61 others
ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

CSS Portal - Tutorials

Outils et Tutoriels... Templates et exemples...

WPF Flickr Viewer Using XLINQ[CodeProject.com]___ demo application___will be explained one at a time

One contains all the images retrieved from the Flickr RSS feed, and the other Window shows a single image that the user clicked on, contains several controls that the user may use to alter the shown image.

Tutoriel : XML, XPath et DotNET - Club d'entraide des développeurs francophones

Lecture et écriture dans un fichier XML avec XPath Date de publication : 26/08/2007 ,