Unterschiede
Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
Nächste Überarbeitung | Vorhergehende Überarbeitung | ||
pub:web-development-toolbox [2013/06/14 11:47] – angelegt Marco Krage | pub:web-development-toolbox [2014/05/12 09:01] (aktuell) – Marco Krage | ||
---|---|---|---|
Zeile 1: | Zeile 1: | ||
====== Web Development Toolbox ====== | ====== Web Development Toolbox ====== | ||
- | Code Snippet collection | + | Rule the InterWebz - Collection of usefull libraries and code snippets for HTML, CSS an Javascript. I love Javascript. |
===== Javascript ===== | ===== Javascript ===== | ||
[[http:// | [[http:// | ||
- | http:// | + | https:// |
+ | https:// | ||
- | <code html>< | + | <code html>< |
- | ==== Namespacing ==== | + | |
- | http:// | + | |
- | <code javascript> | + | |
- | var user = ' | + | |
- | | + | |
- | | + | |
- | function private() { | + | |
- | | + | |
- | } | + | |
- | })(); </ | + | |
- | ==== jQuery Start Template | + | ==== Librarys |
- | <code html> | + | ^ Funktion ^ Link ^ |
- | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js">< | + | | Paramter/Arguments | https://github.com/ |
- | < | + | | Markdown | https:// |
- | < | + | | Cookie | https:// |
- | $(document).ready(function(){ | + | | Lightbox | https://github.com/ |
+ | | Templates | https:// | ||
+ | | Templates | https:// | ||
+ | | Password Fields | https:// | ||
+ | | Form validation | https:// | ||
+ | | Grid | https:// | ||
+ | | Datepicker | https:// | ||
+ | | Extract Values | https:// | ||
+ | | Number Format | https:// | ||
+ | | Instrumente Canvas | https:// | ||
+ | | Pie Chart Favicon | https:// | ||
+ | | Keyboard Shortcuts | https:// | ||
+ | | QRcode | https:// | ||
+ | | Multitouch | https:// | ||
+ | | TOC Inhalt | https:// | ||
+ | | Fullscreen | https:// | ||
+ | | Tabs | https:// | ||
+ | | Progress Bar | https:// | ||
+ | | Google Map | https:// | ||
+ | | Input Max Length | https:// | ||
+ | | Datum | https:// | ||
+ | | jQuery alternative | https:// | ||
+ | | URL | https:// | ||
+ | | Panorama | https:// | ||
+ | | Syntax Highlight | https:// | ||
+ | | prefix-free | https://github.com/ | ||
+ | | Mansory | https:// | ||
+ | | AlphaID | ||
+ | | | | | ||
+ | ==== School ==== | ||
+ | === Namespacing === | ||
+ | http:// | ||
- | $.post(' | ||
- | action: ' | ||
- | }, function (data) { | ||
- | return data | ||
- | }); | ||
- | |||
- | $.getJSON(' | ||
- | action: ' | ||
- | }, function(data) { | ||
- | console.log(data); | ||
- | return data.foo; | ||
- | }); // END: getJSON | ||
- | |||
- | }); | ||
- | </ | ||
- | </ | ||
===== HTML ===== | ===== HTML ===== | ||
==== HTML5 Template ==== | ==== HTML5 Template ==== | ||
- | <code html> | + | https://github.com/sinky/html5-template |
- | < | + | |
- | <html lang=" | + | <html> |
- | < | + | <div class=" |
- | <meta charset=" | + | |
- | < | + | |
- | <meta name=" | + | |
- | <!--[if IE]>< | + | |
- | < | + | |
- | </head> | + | |
- | <body> | + | |
- | <div class=" | + | |
- | <header role="header" | + | |
- | < | + | |
- | </ | + | |
- | <div id=" | + | |
- | < | + | |
- | </ | + | |
- | <footer role=" | + | |
- | < | + | |
- | </ | + | |
- | </ | + | |
- | <script src="// | + | |
- | < | + | |
- | $(document).ready(function(){ | + | |
- | // jQuery Stuff | + | |
- | }); // END jQuery.ready | + | |
- | </ | + | |
- | </body> | + | |
</ | </ | ||
- | </ | ||
===== CSS ===== | ===== CSS ===== | ||
- | [[http://necolas.github.com/ | + | ==== Librarys ==== |
- | Siehe auch [[pub:normalize_css_additional_style]] | + | |
+ | ^ Funktion ^ Link ^ | ||
+ | | Grid | https://github.com/ | ||
+ | | Normalize | https://github.com/necolas/ | ||
+ | | Buttons | https:// | ||
+ | | Colors | https:// | ||
- | Webkit font rendering | + | ==== Webkit font rendering |
<code css>html { | <code css>html { | ||
-webkit-font-smoothing: | -webkit-font-smoothing: | ||
}</ | }</ | ||
- | Nicer Headlines | + | ==== Nicer Headlines |
+ | http:// | ||
<code css>h1, h2 { | <code css>h1, h2 { | ||
text-rendering: | text-rendering: | ||
}</ | }</ | ||
- | CSS Link Fade Animation | + | |
+ | ==== CSS Animation | ||
<code css> | <code css> | ||
a { | a { | ||
Zeile 100: | Zeile 87: | ||
}</ | }</ | ||
- | The new Box Model | + | ==== The new Box Model ==== |
http:// | http:// | ||
<code css>* { | <code css>* { | ||
Zeile 108: | Zeile 95: | ||
</ | </ | ||
+ | ==== Media Queries ==== | ||
<code css>/ | <code css>/ | ||
/* CSS3 Media Queries for Responsiveness (mobile-first, | /* CSS3 Media Queries for Responsiveness (mobile-first, | ||
Zeile 123: | Zeile 111: | ||
@media screen and (min-width: 1192px) { | @media screen and (min-width: 1192px) { | ||
}</ | }</ | ||
+ | |||
+ | ===== Webserver ===== | ||
+ | |||
+ | ==== Moongoose ==== | ||
+ | All platform, portable, slim, simple. | ||
+ | |||
+ | Source: https:// | ||
+ | Builds: https:// | ||
+ |