-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
executable file
·64 lines (64 loc) · 5.98 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JKirchartz's Demos etc.</title>
<meta name="description" content="JKirchartz's demonstrations of html5, css3, javascript, and jquery techniques">
<meta name="viewport" content="width=device-width">
<style>
main {
max-width: 65em;
margin: 0 auto;
padding: 0 1em;
}
</style>
</head>
<body>
<main>
<h1><a href="index.html">JKirchartz's Demos Etc.</a></h1>
<p>Welcome, I'm glad you're here. Check out some of these ideas I've thrown together, kick the tires, let me know what you think.</p>
<p>This site is a work in progress, so please check back again and see what's new.</p>
<h2>The Goods</h2>
<ol>
<li><a href="http://jkirchartz.com/Glitchy3bitdither/">Glitchy 3bit Dither</a><p>Modify image files in unpredictable ways, following the new aesthetic.</p></li>
<li><a href="How_Many_Apocalypses_Have_I_Survived.html">How Many Apocalypses Have I Survived?</a><p>The 2012 "Mayan Calendar" prediction was bunk, but how many other apocalypses did you survive?</p></li>
<li><a href="http://tools.jkirchartz.com/">Minimal Toolkit</a><p>Minimal toolkit in html/js, random colors, unshorten URLs, URI encode/decode, and more.</p></li>
<li><a href="http://tools.jkirchartz.com/jobportal.html">Job Portal</a><p>Search, map, and discover your commute for jobs from <a href="http://indeed.com">indeed.com</a></p></li>
<li><a href="http://tools.jkirchartz.com/remotework.html">Remote Work</a><p>Automatically apply search terms for remote jobs.</li>
<li><a href="fake_russian_generator.html">Fake Russian Generator</a><p>Turns english into pseudo-russian, <a href="https://www.npmjs.com/package/fake-russian">also available as an NPM package</a></p></li>
<li><a href="LibraryOfBabel.html">Library of Babel</a><p>Imitate Borges' fantastic Library.</p></li>
<li><a href="HTML5notepad.html">HTML5 notepad app</a><p>Auto-saves every 500 ms. & on close, in 5 lines of javascript, HTML5 rocks! (ok, I added a polyfill, to support older browsers, so it's a lil' more than that.)</p></li>
<li><a href="./voice/">Voice Experiments</a><p>Some experiments featuring TTS and speech synthesis</p></li>
<li><a href="CMNotepad.html">CodeMirror notepad app</a><p>Auto-saves on change & close, with the power of <a href="https://codemirror.net">CodeMirror</a></p></li>
<li><a href="OKview.html">OKview</a><p>This is an automatic writing app based on the one sentence description of "Grandview" provided on <a href="https://en.wikipedia.org/wiki/Surrealist_automatism#Contemporary_techniques">wikipedia</a>.</p></li>
<li><a href="MultiButton.html">css3 multi-button</a><p>Hiding extra content and links in buttons.</p></li>
<li><a href="bookmarklets.html">bookmarklets</a><p>A Collection</p></li>
<li><a href="browsersize.html">Browser Size</a><p>A tool for determining browser dimensions, suitable for input to chrome's dev tools emulator.</p></li>
<li><a href="Border_Radius_Toy.html">Border Radius Toy</a><p>Edit the 4 corners of a radius in uneven ways, might help find some neat effects or replace an image occasionally; output's the CSS3 code.</p></li>
<li><a href="ds10Buttons.html">ds-10 buttons</a><p>Emulating the drum-pad button animation from the Korg DS-10 with CSS3</p></li>
<li><a href="hslFun.html">HSL fun</a><p>HSL color spinner.</p></li>
<li><a href="webworkers">Web Workers</a><p>Toying with Web Workers</p></li>
<li><a href="webcomponents">Web Components</a><p>Toying with Web Components</p></li>
<!-- li><a href="pushYourLuck.html">Push Your Luck</a><p>A clone of the popular gameshow, no whammies yet, just the animation & click detection. It's a little unreliable on restarting the game & everybody's a winner! It's being designed for full-screen mode so for most browsers hit f11 and give it a go.</p></li -->
<li><a href="sewn.html">Sewn</a><p>simple stitched look with a png texture and border:dashed.</p></li>
<li><a href="http://thecodeplayer.com/walkthrough/30c84daa78b2a5a3bc9b94855b226279">CSS3 Logo Demo</a><p>Mod personal logo with css3 box-shadow.</p></li>
<li><a href="http://codepen.io/JKirchartz/">Codepen</a><p>My collection of demos and projects in the sandbox</p></li>
<li><a href="http://JSfiddle.net/user/JKirchartz">JSFiddle</a><p>My collection of demos and projects in the sandbox</p></li>
<li><a href="http://github.com/JKirchartz">Github</a><p>My collection of git repositories, including this very site.</p></li>
<li><a href="https://jkirchartz.com/awesome-stars/">Awesome Stars</a><p>My collection of starred github repos, who knows what cool stuff is in here!</p></li>
</ol>
<h2 id="presentations">Presentations</h2>
<p>A collection of presentations I may or may not have already given</p>
<ul>
<li><a href="./Bootstrap/">Better Bootstrap with Atomic Design</a><p><small>Work In Progress</small></p></li>
<li><a href="./Laws/">Laws That Control Software</a><p><small>Work In Progress</small></p></li>
<li><a href="./SmarTrash/">SmartTrash</a><p>Team Hyperham's winning Steel City Codefest 2016 presentation</p></li>
<li><a href="./html5skyword/">HTML 5</a><p>Introducing HTML5 (circa 2013)</p></li>
</ul>
<div id="footer">
<p>All code <a href="https://github.com/JKirchartz/Demos">here</a> is presented under the <a href="https://raw.github.com/JKirchartz/NPL/master/NPL.txt">Necessary Public License</a></p>
</div>
</main>
</body>
</html>