Material Design Lite
Zoom sur l'effet parallaxe
Après avoir abordé les arrière-plans extensibles (full background) nous allons continuer avec l'effet parallaxe. Cet effet graphique étant facile à comprendre et à mettre en place, vous allez pouvoir créer rapidement un site original. Ce tutoriel va utiliser jQuery ainsi que le plug-in jQuery-Parallax. Qu'est-ce que l'effet parallaxe ? Il s'agit d'un terme générique correspondant au déplacement de plusieurs éléments sur des couches et à des vitesses différentes. Au scroll (défilement de la vue) ou en fonction des coordonnées de la souris, les positions des différents fonds (ou éléments à animer) vont changer, ce qui va générer un effet de profondeur. Des exemples Utilisant le positionnement de la souris digitalhands.net bikingboss.com Utilisant le niveau du scroll nikebetterworld.com ok-studios.de driver-club Principe et théorie Grâce à l'utilisation de JavaScript, il est possible de déplacer les éléments par rapport à la position de la souris ou du niveau de défilement (scroll). En pratique
Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit!
CSS Zen Garden: The Beauty of CSS Design
ie7-js - A JavaScript library to make MSIE behave like a standards-compliant browser.
IE7.js is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6. Current version: 2.1 beta4. IE7.js Upgrade MSIE5.5-6 to be compatible with MSIE7. IE8.js Upgrade MSIE5.5-7 to be compatible with MSIE8. You do not need to include IE7.js if you are using IE8.js IE9.js Upgrade MSIE5.5-8 to be compatible with modern browsers. You do not need to include IE7/IE8.js if you are using IE9.js The script only fixes images named: *-trans.png If you want the fix to apply to all PNG images then set a global variable as follows: var IE7_PNG_SUFFIX = ".png"; You must set this variable before including the IE7.js script. <script src="IE8.js">IE7_PNG_SUFFIX=".png";</script> The suffix will ignore query string parameters. var IE7_PNG_SUFFIX = ":"; By default, the PNG will be stretched (this simulates tiling). You may link directly to these files if you wish:
Télécharger Easy Thumbnails 3.0
Plus d'images Easy Thumbnails est un logiciel gratuit dans la Gestion de la Photo qui va vous permettre tout simplement de créer vos propres vignettes ou images miniatures. Au sein de son interface conviviale, vous allez pouvoir rechercher vos images et créer vos miniatures. Vous allez pouvoir travailler sur un seul fichier, mais également sur un groupe d’images, ou sur plusieurs dossiers. Le logiciel vous permettra également d’effectuer des rotations, d’ajuster le contraste de l’image, la luminosité, la hauteur et la qualité. Easy Thumbnails prend également en charge la quasi totalité des formats d'images connus : JPEG, JPG, JPEG2000, GIF, PNG, TIFF, BMP, TGA, ICO, etc. Plus d'infos sur Windows sont sur la page consacrée à l'Actualité de Windows et vous pouvez vous rendre sur le Forum dédié aux Logiciels si vous souhaitez participer aux discussions.
Mootools en 30 jours : jour 1 - Introduction
Installation de Mootools 1.2 Tout d'abord, téléchargez et installez le noyau (core) de la librairie Mootools 1.2. Téléchargez la librairie Mootools 1.2 CoreUploadez la librairie de Mootools 1.2 sur votre serveur ou espace de travailFaites un lien vers la librairie Mootools 1.2 Core entre les balises de votre page - 2. Créer un fichier JavaScript externe et faire le lien vers celui-ci dans votre : A partir de là, vous pouvez utiliser l'une ou l'autre des méthodes. Placer dans le domready Les fonctions Mootools doivent être appelées dans l'évènement domready. window.addEvent('domready', function() { exampleFunction();}); Placer dans une Fonction Vous pouvez quand même placer vos fonctions en dehors du domready, puis les appeler à l'intérieur de celui-ci. var exampleFunction = function() { alert('hello')}; Description de la librairie Noyau Natif Classes Une classe JavaScript (c'est différent d'une classe CSS), est un objet réutilisable avec des fonctionnalités. Elements Utilitaires Request Plugins
Structurer un site web avec XMind
Tous les spécialistes vous le diront : le principal problème lors de la création d’un site web, c’est la structure. Difficile, en effet, de visualiser la place de chaque page et les liens entre elles. Le mindmapping peut vous y aider. Et XMind, avec ses différents formats, peut vous amener un pas plus loin. Démonstration. Le cauchemar des webdesigners, c’est le client qui a une idée floue de ce qu’il veut. C’est un peu normal, pourtant. Prenons un exemple simple : le site d’une boutique de produits provençaux. Première étape : les 4 premières pages La "Provençale" est une boutique. Nous commençons à compléter les pages : Etape 2 : les pages Entreprise et Produits A la page Entreprise, nous pouvons ajouter une page Boutique, qui présente la boutique matérielle, le point de vente. Sur notre page d’accueil, nous pouvons ajouter : un message de bienvenueun lien vers la boutiqueun lien vers les produits 3e étape : l’ajout d’un message à la page d’accueil, d’un blog, de liens vers les pages
Buzz, a Javascript HTML5 Audio library
Formation facile
L'application formation-facile vous permet de vous former aux métiers de l'informatique gratuitement sur votre smartphone ou votre tablette ! Accédez à plus de 300 vidéos gratuites et apprenez à créer des jeux, créer votre site internet, créer des logiciels ou à faire des montages vidéo !Toutes nos formations sont en HD pour un confort maximal. N'hésitez pas à poser vos questions à propos de nos cours vidéo. Formation facile c'est des centaines d'heures de tutoriels et plusieurs millions de vues. Vous aussi apprenez le développement de façon rapide et efficace. Si vous appréciez cette application pensez à la noter et à laisser votre commentaire pour nous encourager à réaliser de nouvelles vidéos. The application-easy training allows you to train for careers in computer free on your smartphone or tablet! Easy formation is hundreds of hours of tutorials and several million views. If you like this application consider the note and leave your comments to encourage us to make new videos.
Simplifier vos vues avec KnockoutJS : c'est plus simple que vous pensez
Dans quelques instants, je vais vous présenter une méthode pour simplifier le développement de vos vues grâce à un framework Javascript qui va vraiment vous apporter du changement dans votre manière de travailler. Vous avez sûrement déjà essayé de coder des interfaces graphiques complexes avec des mises à jour dans tous les sens… Si je change cette dropdown, il faut mettre ce champ là à jour… Bref, nous connaissons tous ce type de mécanisme dans le Web. Pour mettre en place cette logique d’affichage, le plus simple est d’écrire du code Javascript et de le lier à des évènements des composants sur la page (par exemple l’évènement Change d’une Dropdown list ou d’une Textbox). Seulement voilà, écrire du code comme ceci « à la main » fonctionne bien quand vous avez 2 ou 3 règles à gérer. Dans cet article, je vous présente le framework KnockoutJS. Je tiens à préciser que ce framework est aujourd’hui largement utilisé et possède une grande communauté de développeurs. Exemple 1 : liaison simple
Tutos vidéo programmation, Unity3D, web - formation-facile
koenbok/Framer: Framer - Design interaction and animation
