background preloader

Ink – Une boite à outils pour vos interfaces web

Ink – Une boite à outils pour vos interfaces web
Ink – Une boite à outils pour vos interfaces web Si vous développez des sites, je vous invite aujourd'hui à découvrir la boite à outil Ink qui permet de créer rapidement des interfaces web. Tout est parfaitement documenté, et tout semble simple avec Ink. Vous serez capable rapidement de mettre en place le layout de votre choix, puis tous types de menus (verticaux, horizontaux), votre pagination..etc., sans oublier tout ce qui concerne la mise en page textuelle, les listes, les styles, les formulaires, les alertes...etc. Ink vous permettra de gagner pas mal de temps pour construire vos projets web en vous évitant de recoder tous les trucs de base. Vous avez aimé cet article ?

Comment générer une box CSS avec ombre portée Si vous cherchez un moyen de générer de jolis cadres en CSS avec ombre portée et tout le bordel... Du genre de celui-ci : Ne vous prenez plus la tête ! Il existe un super générateur très simple à utiliser. Et hop, c'est tout chaud démoulé, prêt à être intégré dans vos pages web. Rejoignez les 52126 korbenautes et réveillez le bidouilleur qui est en vous Suivez KorbenUn jour ça vous sauvera la vie.. Générer des photos avec votre application mobile dessus Vous développez des applications pour mobile ou tablettes, et vous vous êtes lancé dans la réalisation d'un site pour les promouvoir ? Excellente idée ! Sauf que, si comme moi, vous êtes une brêle en design (ou un egosigner qui refuse de changer de branche), votre site doit manquer un peu d'illustrations sympas pour mettre en avant vos applications. C'est pourquoi je vous ai dégoté un petit générateur de photo baptisé Breezi, sur lequel il vous suffit de glisser déposer une image aux bonnes dimensions (c'est comme le Port-Salut, c'est écrit dessus) afin d'obtenir des résultats comme ceux-ci : Je savais que ça vous plairait ! L'outil est on ne peut plus simple à utiliser et disponible gratuitement ici. Rejoignez les 52315 korbenautes et réveillez le bidouilleur qui est en vous Suivez KorbenUn jour ça vous sauvera la vie..

rewrite Available Languages: en | fr Summary This module uses a rule-based rewriting engine (based on a regular-expression parser) to rewrite requested URLs on the fly. This module operates on the full URLs (including the path-info part) both in per-server context (httpd.conf) and per-directory context (.htaccess) and can generate query-string parts on result. Further details, discussion, and examples, are provided in the detailed mod_rewrite documentation. Quoting Special Characters As of Apache 1.3.20, special characters in TestString and Substitution strings can be escaped (that is, treated as normal characters without their usual special meaning) by prefixing them with a backslash ('\') character. Environment Variables This module keeps track of two additional (non-standard) CGI/SSI environment variables named SCRIPT_URL and SCRIPT_URI. Notice: These variables hold the URI/URL as they were initially requested, that is, before any rewriting. Example Rewriting in Virtual Hosts Example: Security

Un arrière-plan extensible intelligent Certains sites affichent une (grande) image de fond qui s'adapte à toutes les dimensions de la fenêtre du navigateur, proportionnellement, sans la déformer. La réalisation de ce genre de prouesse n'est pas si évidente techniquement, contrairement à ce que l'on pourrait croire de prime abord. Comment fait-on ? Nous allons présenter ici deux méthodes parmi celles qui sont possibles : une entièrement en CSS , une autre basée sur jQuery. Exemples Pour avoir un aperçu de ce que l'on veut obtenir, voici quelques exemples utilisant ce principe : Simon & Comet Flavors me Piz'za-za Le point commun de tous ces sites est la mise en avant de leur background : il est fixe et c'est la pièce maîtresse de leur design. Le principe Comme vous venez de le remarquer, ce n'est pas qu'une simple image de fond qui s'adapte à la fenêtre : il n'y a aucune déformation, le ratio est toujours conservé et lorsque la fenêtre est vraiment étroite le fond est recadré. Préparation de l'image de fond La méthode CSS3 Le code HTML

Cross-browser fingerprinting test 2.0 While we browse the web, most web pages have an interest in observing our behaviour in order to achieve certain business benefits. Read more » For example, they would like to know what kind of content the visitor is interested in, and, more specifically, what to recommend to a user who has already downloaded certain page(s) (e.g. article(s)). Therefore, vaguely knowing users’ areas of interest is often insufficient; most web pages will be interested in the entire course of a visit, and, in the case of returning visitors, they want to know the whole browsing history, too. In order to pull this off, the web server needs to store a personal 'file' about each user, and must be able to identify returning visitors.However, there are certain technical restrictions to such activities, and therefore newer and newer techniques are invented to identify and profile users. For some of these – such as web bugs – it is indispensable to store an identifier on the user’s computer.

An In Depth Guide to mod_rewrite for Apache Twice a month, we revisit some of our readers’ favorite posts from throughout the history of Nettuts+. This tutorial was first published last September. When people think of .htaccess configuration, the first thing that might pop into their minds is URL manipulation with mod_rewrite. But they're often frustrated by mod_rewrite's complexity. This tutorial will walk you through everything you need to know for the most common mod_rewrite tasks. Mod_rewrite Rants Thoughts on mod_rewrite vary quite a bit. mldk: Aargh! bsterzenbach: Man do I love mod_rewrite. mikemackay: Still loving the total flexibility of mod_rewrite - coming to the rescue again. hostpc: I hate mod_rewrite. awanderingmind: Oh Wordpress and Apache, how thou dost vex me. danielishiding: Why won’t mod_rewrite work! A few things I noticed are that people clearly recognize the power of mod_rewrite, but are often frustrated by the syntax. Despite the tons of examples and docs, mod_rewrite is voodoo. What a turn off! URL vs. Syntax

Expanding Images using HTML5's contenteditable tabindex HTML5 has a new attribute, contenteditable, which can be applied to any element which allows it to be edited directly in the browser window. Think of text input with a predefined value, but it can literally be any element. Form elements like text inputs support the :focus pseudo class, which allow us to style those elements when they are clicked upon or otherwise navigated to. Giving an element the contenteditable attribute means it also now supports the :focus pseudo class, which opens up some interesting possibilities! We'll exploit this little trick to make an expanding image (like a lightbox without the overlay) right within some content. UPDATE: Even better, you can give attributes a tabindex attribute, like you would a form element, which allow allows :focus without the editability. HTML5 Markup HTML5 has nice elements for including captioned images. <section class="image-gallery"><figure><img src="images/img-1.jpg" alt="jump, matey" /><figcaption">Jump! The Images The CSS Related

Brackets – L’éditeur open source d’Adobe Brackets est un éditeur de code open source et sous licence MIT, développé et maintenu par les équipes d'Adobe qui fonctionne aussi bien sous Windows que Linux et Mac OSX. J'en avais parlé l'année dernière et il a plutôt bien évolué. Du coup, j'ai pris un peu de temps pour le tester et je dois dire qu'il est plutôt sympa. Style épuré, léger, et avec quelques fonctionnalités bien pratiques. Par exemple, si vous éditez des CSS, vous pouvez choisir visuellement vos codes couleur. L'autocomplétion est évidemment au rendez-vous, ce qui permet de coder un peu plus vite et surtout, Brackets dispose d'un mode "Aperçu en direct" qui permet de connecter l'éditeur à Google Chrome et de visualiser chaque modification réalisée sur une page web, sans avoir à rafraichir celle-ci. A noter que l'éditeur de texte utilisé par Brackets est CodeMirror. Ce qui est sympa avec Brackets, c'est aussi le support des modules. Brackets est à télécharger ici. Vous avez aimé cet article ?

apiDoc - Inline Documentation for RESTful web APIs Preface All examples in this document use the Javadoc-Style (can be used in C#, Go, Dart, Java, JavaScript, PHP, TypeScript and all other Javadoc capable languages): /** * This is a comment. */ For other languages use their specific multiline comment code: CoffeeScript ### This is a comment Erlang (% within the comment is optional) %{ % This is a comment. %} Perl (Doxygen) #** # This is a comment Python """ This is a comment Ruby =begin This is a comment. Install npm install apidoc -g Run apidoc -i myapp/ -o apidoc/ -t mytemplate/ Creates an apiDoc of all files within dir myapp/, uses template from dir mytemplate/ and put all output to dir apidoc/. Without any parameter, apiDoc generate a documentation from all .cs .dart .erl .go .java .js .php .py .rb .ts files in current dir (incl. subdirs) and writes the output to . Command Line Interface Show command line parameters: apidoc -h Important parameters: GRUNT Module A separate grunt module is supported, visit github.com/apidoc/grunt-apidoc or install via npm:

Effet Lightbox en CSS3 grâce à transition Effet Lightbox en CSS3 grâce à transition Cet article a 4 années. Il commence à dater, lisez-le donc en gardant son âge en tête ! Merci publié le Lu 29 965 fois. C’est en parcourant un lien partagé par Raphaël hier dans la journée, que je me suis décidé à tripoter un petit peu de CSS et HTML pour améliorer le rendu de M. Où cela se passe-t-il ? Vous trouverez les fichiers sur l’espace de test de CreativeJuiz, précisément à cette adresse : Le HTML Le code HTML utilisé est vraiment basique. <figure tabindex="0"> <img src="images/demo1.jpg" alt="Demo" /> <figcaption>Rorschach Artefact</figcaption> </figure> <span></span> <figure tabindex="0"> <img src="images/demo2.jpg" alt="Demo" /> <figcaption>Mystic Light</figcaption> </figure> <span></span> <figure tabindex="0"> <img src="images/demo3.jpg" alt="Demo" /> <figcaption>A simple idea... Le CSS Contenteditable M. À propos de Geoffrey Laisser un commentaire

Comment éviter d'installer des Adware sur votre ordinateur « Korben Korben Comment éviter d’installer des Adware sur votre ordinateur Lorsqu'on est sous Windows et qu'on adore installer tout un tas de softs étranges, il faut savoir rester vigilant. En effet, certains programmes d'install proposent durant l'installation des toolbars et autres adware qui seront difficiles par la suite à retirer de votre système. En général, on fait attention, et on décoche les cases qui vont bien, mais il suffit d'une fois, d'un petit coup de barre et on laisse passer la toolbar fatale. Mais pourquoi se prendre la tête alors qu'un petit soft peut faire le travail pour vous ? Il s'agit de Unchecky, un service qui tourne en tâche de fond sous Windows, qui détectera automatiquement les logiciels additionnels dans les programmes d'installation et qui décochera les cases qu'il faut pour éviter de se faire polluer. Indispensable à avoir dans sa boite à outils ! Vous avez aimé cet article ?

Développement d'applications web multimédias Jules VERNE | CD de collection | nouvelle version Information générale Interface graphique (au format HTML-CSS-jQuery, pour toute plate-forme) pour la consultation en/hors ligne (version CD) des 69 romans, 21 nouvelles (et autres) de Jules VERNE, parus entre 1845 et 1914 (et plus ...). version actuelle: 2011.01 Tous droits réservés © 2011+ ISBN 978-2-923610-02-3 Détails Peut fonctionner sur divers supports: CD, DVD, clé USB Conçu à la base, pour une résolution d'écran de 1024 X 768 pixels et plus Permet la consultation des formats PDF, Flash, ePub, ... Droits et copyright Pour une utilisation personnelle (non commerciale et non professionnelle). Téléchargement | uniquement les livres numériques chez ELG C'est gratuit mais merci de faire un don volontaire sur la page de ELG Téléchargement Téléchargement ou CD | l'interface graphique et les livres

Transitions CSS3 Beaucoup d'intégrateurs en ont rêvé : animer les pages web uniquement à l'aide de styles CSS, sans apport de JavaScript. Grâce aux dernières évolutions du langage et au module CSS3 Transitions, il est désormais possible de réaliser des transitions basiques à l'aide de CSS dans les navigateurs récents (Safari 4+, Chrome 2+, Firefox 4+, Internet Explorer 10 et Opera 10.6+) La spécification est le document qui définit de manière claire, précise et univoque le langage. La spécification relative au module est disponible à l'adresse suivante : Remarque : Les moteurs récents implémentent la spécification. Principe de base Le principe de base d'une transition CSS3 est de permettre une transition douce entre l'ancienne valeur et la nouvelle valeur d'une propriété CSS lorsqu'un événement est déclenché : soit via une pseudo-classe telles que :hover, :focus ou :active soit via JavaScript La ou les propriété(s) à animer La durée de l'animation Exemples concrets

Related: