Hosted Libraries | Hosted Libraries | Google Developers The Google Hosted Libraries is a stable, reliable, high-speed, globally available content distribution network for the most popular, open-source JavaScript libraries. Google works directly with the key stakeholders for each library effort and accepts the latest versions as they are released. Libraries To load a hosted library, copy and paste the HTML snippet for that library (shown below) in your web page. We recommend that you load libraries from the CDN via HTTPS, even if your own website only uses HTTP. Dojo snippet: site: dojotoolkit.org versions: Ext Core sencha.com/products/extcore Hammer.JS hammerjs.github.io Indefinite Observable jQuery 3.x snippet: 2.x snippet: 1.x snippet: jquery.com note: 3.3.0, 2.1.2, 1.2.5 and 1.2.4 are not hosted due to their short and unstable lives in the wild. jQuery Mobile jquerymobile.com This library depends on jQuery. jQuery UI jqueryui.com This library depends on jQuery. MooTools mootools.net Myanmar Tools three.js
Composer le HTML avec les CSS - Apprendre le développement Web Les Cascading StyleSheets — ou CSS — (Feuilles de style en cascade) sont la première technique à apprendre après le HTML. Alors que HTML s'utilise pour définir la structure et la sémantique du contenu, les CSS sont employées pour composer et déterminer l'apparence de ce contenu. Ainsi par exemple, vous utiliserez les CSS pour modifier les polices, la couleur, la taille et l'espacement de votre contenu, pour le répartir sur plusieurs colonnes ou bien pour ajouter des animations et autres fonctionnalités décoratives. Parcours d'apprentissage Vous devriez vraiment apprendre les bases du HTML avant d'essayer n'importe quelles CSS. des CSS, en commençant avec le module Introduction aux CSS des Modules HTML plus avancés du JavaScript et sur la manière de l'utiliser pour ajouter des fonctionnalités dynamiques aux pages web. Une fois compris les principes fondamentaux du HTML, nous vous recommandons d'apprendre HTML et CSS simultanément, en vous déplaçant d'un sujet à l'autre. Modules Voir aussi
Scriptol.fr, techniques de programmatio Les bases des CSS - Apprendre le développement Web Les CSS (Cascading Style Sheets en anglais, ou « feuilles de style en cascade ») sont le code utilisé pour mettre en forme une page web. Les bases des CSS présentent ce qu'il faut savoir pour commencer. Nous répondrons à des questions comme : Comment rendre mon texte rouge ou noir ? Donc, que sont les CSS, réellement ? De la même façon que HTML, CSS n'est pas vraiment un langage de programmation. Faisons un essai : copiez ces trois lignes de code CSS dans un nouveau fichier dans votre éditeur de texte, puis sauvegardez le fichier sous le nom style.css dans votre répertoire styles. Pour que cela fonctionne, il faut appliquer le CSS au document HTML, sinon la mise en forme décrite dans le fichier CSS n'affectera pas l'affichage de la page HTML dans la navigateur (si vous n'avez pas suivi toutes les étapes pour arriver ici, vous pouvez lire l'article Gérer les fichiers et Les bases du HTML pour savoir par où commencer). Si le texte de votre paragraphe s'affiche en rouge, félicitations !
Free jQuery Plugins and Tutorials - jQuery Script CSS Styling Images Optimiser un site sur les pages perso de Free Quelques trucs et astuces pour optimiser un site sur les pages perso de Free. Généralités Bien que les connexions Internet haut débit se généralisent rapidement, une grande partie des visiteurs des sites Web utilisent des connexions dont la bande passante est limitée (blocage FAI, terminaux mobiles et tablettes, zones rurales…). Il est essentiel de concevoir des sites Web légers, se chargeant rapidement sur tous les terminaux et ne surchargeant les pas les serveurs de Free. Ces modifications sont relativement simples à mettre en place pour la majorité d’entre-elles. Il est utile de : Respect des standards Il est essentiel de présenter aux visiteurs des pages respectueuses des standards du « Web » si l'on souhaite améliorer la rapidité d'affichage des pages du site. Il s'agit de l'une des optimisations les plus simples à réaliser. Liens utiles Bien utiliser les caches Mark Nottingham — Un tutoriel de la mise en cache pour les auteurs Web et les webmestres La compression des pages web
5 nouveautés CSS qui vont tout changer à la mise en forme… Pour fêter le 1000e article du blog, rien de mieux qu'un article complet et détaillé sur l'avenir de CSS. Bonne lecture ! Le langage CSS (Cascading style sheets) permet de gérer la mise en forme des pages web intégrées en HTML, souvent accompagné par son acolyte Javascript pour certaines animations complexes. Facile à prendre en main avec sa syntaxe très abordable et sa liste de propriétés relativement limitée, CSS offre un confort de programmation qui lui offre l'appréciation de bon nombre de débutants ou de profanes. Nous allons découvrir dans la suite de cet article 5 nouveautés du langage CSS qui le rapproche de plus en plus des langages de programmation classiques, avec des possibilités accrues et utiles pour aller plus loin dans les techniques de mise en forme et d'animation. Nouveautés d'aujourd'hui ou de demain ? À l'heure d'écrire ces lignes, la majorité des fonctionnalités CSS présentées ci-après ne fonctionnent pas correctement sur l'ensemble des navigateurs. 1. 2. 3. 4. 5.
3Dmol.js tutorialUsing 3Dmol within your code The most simple way to display and style a 3Dmol instance is by embedding 3Dmol parameters within a URL or within HTML tags. However, if you are interacting with this viewer from your own web pages then you may want to take advantage of the 3Dmol API. Here we will use the API to create, load and style the 3Dmol instance. Note, this tutorial assumes a basic knowledge of HTML, Javascript and jQuery. Creating the 3DMol instance First, make sure your HTML document links to the 3Dmol code. Now create a container tag in the HTML document that will hold the vizualisation. Note: 3Dmol will adopt the size of the container so we need to make sure this size has been explicitly set (i.e. use CSS or an inline style attribute). Once the web page has loaded, we can create a new instance of 3Dmol. To make sure everything works, we are going to add a sphere, set the camera, render the scene, then add a zoom. Documentation: $3Dmol.createViewer() viewer.setBackgroundColor('white'); Loading data dynamically
Comment appliquer un filtre CSS3 de floutage à une image de fond background-image ? En CSS3, il est possible de flouter une image en utilisant le filtre blur. Voici comment faire. Les filtres fournis par le langage CSS3 permettent d'appliquer différents effets sur des images. Il est par exemple possible de flouter une image en utilisant le filtre blur. On peut appliquer à ce filtre un rayon en pixels, qui correspond au nombre de pixels qui seront mélangés entre eux. Plus le chiffre est élevé, plus l'effet de flou est important. /* Filtre en pixels */ filter : blur(5px) /* Filtre avec un fichier */ filter : url(flou.svg) Si l'on veut flouter l'image d'arrière-plan du site, il faut tout d'abord séparer le site en 2 containers, un qui contient l'image d'arrière-plan et un pour le contenu du site. <! Il suffit ensuite d'appliquer le CSS suivant pour que le fond soit flouté et que le contenu du site soit visible clairement devant le fond : En CSS3, il est possible de flouter une image en utilisant le filtre blur. <!
MathJax filter - CSS : Feuilles de style en cascade Cette fonction est expérimentalePuisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification. La propriété filter permet d'appliquer des filtres et d'obtenir des effets graphiques de flou, de saturation, etc. Les filtres sont généralement utilisés pour ajuster le rendu d'une image, d'un arrière-plan ou des bordures. Plusieurs fonctions sont inclues dans le standard CSS et permettent d'obtenir des effets prédéfinis. Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Syntaxe Avec une fonction, on utilisera la forme suivante : filter: <filter-function> [<filter-function>]* | none En utilisant un élément SVG <filter>, on utilisera la forme suivante : filter: url(file.svg#filter-element-id)
JavaScript Obfuscator Tool Les filtres CSS En été, il n'y a pas que les filtres solaires, c'est aussi le moment idéal pour se pencher sur une propriété qui peut être utile... ou pas. Par Paula Borowska. Par Paula Borowska Qu'est-ce que les filtres CSS ? Honnêtement, il y a des propriétés CSS stupéfiantes, et CSS filters en fait partie. Les filtres ont une capacité étonnante de transformer des images et des pages web tout entières. L'utilisation des filtres CSS est extrêmement simple, toutefois il faut noter que la syntaxe n'est pas tout à fait habituelle. Tout d'abord, il y a un préfixe webkit. Les différents types de filtres Il existe de nombreux filtres, certains plus habituels que d'autres, certains plus utiles que d'autres aussi. Grayscale Je viens de mentionner grayscale. Sepia Je ne sais pas si on applique encore beaucoup ce type d'effet, mais si vous le voulez, il est là. Blur Le filtre blur (floutage) fonctionne d'une manière assez similaire au filtre Gaussien de Photoshop. Saturation Contrast Brightness Hue-rotation Invert Utilité