====== Web Development Toolbox ====== Rule the InterWebz - Collection of usefull libraries and code snippets for HTML, CSS an Javascript. I love Javascript. ===== Javascript ===== [[http://docs.jquery.com/Downloading_jQuery|jQuery Download]] - [[http://developers.google.com/speed/libraries/devguide?hl=de#jquery|Google CDN]] https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js ==== Librarys ==== ^ Funktion ^ Link ^ | Paramter/Arguments | https://github.com/stretchr/arg.js | | Markdown | https://github.com/chjj/marked | | Cookie | https://github.com/carhartl/jquery-cookie | | Lightbox | https://github.com/dimsemenov/Magnific-Popup | | Templates | https://github.com/blueimp/JavaScript-Templates | | Templates | https://github.com/archan937/templayed.js | | Password Fields | https://github.com/antelle/passfield | | Form validation | https://github.com/guillaumepotier/Parsley.js | | Grid | https://github.com/suprb/Grid-A-Licious | | Datepicker | https://github.com/dbushell/Pikaday | | Extract Values | https://github.com/laktek/extract-values | | Number Format | https://github.com/adamwdraper/Numeral-js | | Instrumente Canvas | https://github.com/toorshia/justgage | | Pie Chart Favicon | https://github.com/lipka/piecon | | Keyboard Shortcuts | https://github.com/ccampbell/mousetrap | | QRcode | https://github.com/lrsjng/jQuery.qrcode | | Multitouch | https://github.com/EightMedia/hammer.js | | TOC Inhalt | https://github.com/jgallen23/toc | | Fullscreen | https://github.com/sindresorhus/screenfull.js | | Tabs | https://github.com/aarondo/tabulous.js | | Progress Bar | https://github.com/usablica/progress.js; https://github.com/rstacruz/nprogress | | Google Map | https://github.com/danielemoraschi/maplace.js | | Input Max Length | https://github.com/pioul/jQuery.Maxlength | | Datum | https://github.com/MatthewMueller/date | | jQuery alternative | https://github.com/timjansen/minified.js | | URL | https://github.com/websanova/js-url | | Panorama | https://github.com/peachananr/panorama_viewer | | Syntax Highlight | https://github.com/isagalaev/highlight.js; https://github.com/mozilla/sweet.js | | prefix-free | https://github.com/LeaVerou/prefixfree | | Mansory | https://github.com/kombai/freewall | | AlphaID (like Youtube) | http://www.hashids.org/ | | | | ==== School ==== === Namespacing === http://stackoverflow.com/a/2421949 -- http://jsfiddle.net/sinky/P9L9W/ -- http://jsfiddle.net/xub6u/ ===== HTML ===== ==== HTML5 Template ==== https://github.com/sinky/html5-template
===== CSS ===== ==== Librarys ==== ^ Funktion ^ Link ^ | Grid | https://github.com/grahammiller/ResponsiveGridSystem | | Normalize | https://github.com/necolas/normalize.css | | Buttons | https://github.com/necolas/css3-github-buttons | | Colors | https://github.com/mrmrs/colors | ==== Webkit font rendering ==== html { -webkit-font-smoothing: antialiased; } ==== Nicer Headlines ==== http://aestheticallyloyal.com/public/optimize-legibility/ h1, h2 { text-rendering: optimizeLegibility; } ==== CSS Animation ==== a { -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } ==== The new Box Model ==== http://paulirish.com/2012/box-sizing-border-box-ftw/ * { -moz-box-sizing: border-box; box-sizing: border-box; } ==== Media Queries ==== /*-----------------------------------------------------------------------------------*/ /* CSS3 Media Queries for Responsiveness (mobile-first, from small to big) /*-----------------------------------------------------------------------------------*/ /* --- smartphones in landscape mode --- */ @media screen and (min-width: 480px) { } /* --- tablets in portrait mode --- */ @media screen and (min-width: 768px) { } /* tablets in landscape mode */ @media screen and (min-width: 1024px) { } /* standard laptop + desktop screens */ @media screen and (min-width: 1192px) { } ===== Webserver ===== ==== Moongoose ==== All platform, portable, slim, simple. Source: https://github.com/valenok/mongoose Builds: https://code.google.com/p/mongoose/