all da files
This commit is contained in:
jllord
22
oldcrap/index.html
Normal file
22
oldcrap/index.html
Normal file
@@ -0,0 +1,22 @@
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>Hack Spots</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/lettering.js"></script>
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$(".page-title").lettering();
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1 class="page-title">Hack Spots </h1>
|
||||
<h1></h1>>Hack Spots </h1>
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
36
oldcrap/index2.html
Normal file
36
oldcrap/index2.html
Normal file
@@ -0,0 +1,36 @@
|
||||
<html>
|
||||
<head>
|
||||
<style type="text/css">
|
||||
#myTypingText {
|
||||
width:700px;
|
||||
height:120px;
|
||||
padding:12px;
|
||||
color:#333;
|
||||
font-family: Helvetica, sans-serif;
|
||||
font-size:100px;
|
||||
line-height:1.5em;
|
||||
}
|
||||
|
||||
#myTypingText::before {
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="myTypingText"></div>
|
||||
<script type="text/javascript" language="javascript">
|
||||
var myString = "Hack Spots";
|
||||
var myArray = myString.split("");
|
||||
var loopTimer;
|
||||
function frameLooper() {
|
||||
if(myArray.length > 0) {
|
||||
document.getElementById("myTypingText").innerHTML += myArray.shift();
|
||||
} else {
|
||||
clearTimeout(loopTimer);
|
||||
}
|
||||
loopTimer = setTimeout('frameLooper()',100);
|
||||
}
|
||||
frameLooper();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
21
oldcrap/index3.html
Normal file
21
oldcrap/index3.html
Normal file
@@ -0,0 +1,21 @@
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>Hack Spots</title>
|
||||
<link rel="stylesheet" href="scrap.css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/lettering.js"></script>
|
||||
|
||||
<script>
|
||||
// $(document).ready(function() {
|
||||
// $(".page-title").lettering();
|
||||
// });
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1 class="page-title">Hack Spots<span> </span> </h1>
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
2
oldcrap/js/jquery.js
vendored
Normal file
2
oldcrap/js/jquery.js
vendored
Normal file
File diff suppressed because one or more lines are too long
66
oldcrap/js/lettering.js
Normal file
66
oldcrap/js/lettering.js
Normal file
@@ -0,0 +1,66 @@
|
||||
/*global jQuery */
|
||||
/*!
|
||||
* Lettering.JS 0.6.1
|
||||
*
|
||||
* Copyright 2010, Dave Rupert http://daverupert.com
|
||||
* Released under the WTFPL license
|
||||
* http://sam.zoy.org/wtfpl/
|
||||
*
|
||||
* Thanks to Paul Irish - http://paulirish.com - for the feedback.
|
||||
*
|
||||
* Date: Mon Sep 20 17:14:00 2010 -0600
|
||||
*/
|
||||
(function($){
|
||||
function injector(t, splitter, klass, after) {
|
||||
var a = t.text().split(splitter), inject = '';
|
||||
if (a.length) {
|
||||
$(a).each(function(i, item) {
|
||||
inject += '<span class="'+klass+(i+1)+'">'+item+'</span>'+after;
|
||||
});
|
||||
t.empty().append(inject);
|
||||
}
|
||||
}
|
||||
|
||||
var methods = {
|
||||
init : function() {
|
||||
|
||||
return this.each(function() {
|
||||
injector($(this), '', 'char', '');
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
words : function() {
|
||||
|
||||
return this.each(function() {
|
||||
injector($(this), ' ', 'word', ' ');
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
lines : function() {
|
||||
|
||||
return this.each(function() {
|
||||
var r = "eefec303079ad17405c889e092e105b0";
|
||||
// Because it's hard to split a <br/> tag consistently across browsers,
|
||||
// (*ahem* IE *ahem*), we replaces all <br/> instances with an md5 hash
|
||||
// (of the word "split"). If you're trying to use this plugin on that
|
||||
// md5 hash string, it will fail because you're being ridiculous.
|
||||
injector($(this).children("br").replaceWith(r).end(), r, 'line', '');
|
||||
});
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
$.fn.lettering = function( method ) {
|
||||
// Method calling logic
|
||||
if ( method && methods[method] ) {
|
||||
return methods[ method ].apply( this, [].slice.call( arguments, 1 ));
|
||||
} else if ( method === 'letters' || ! method ) {
|
||||
return methods.init.apply( this, [].slice.call( arguments, 0 ) ); // always pass an array
|
||||
}
|
||||
$.error( 'Method ' + method + ' does not exist on jQuery.lettering' );
|
||||
return this;
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
43
oldcrap/scrap.css
Normal file
43
oldcrap/scrap.css
Normal file
@@ -0,0 +1,43 @@
|
||||
@-webkit-keyframes typing {
|
||||
from { width: 100%; }
|
||||
to { width:0; }
|
||||
}
|
||||
|
||||
@-webkit-keyframes blink-caret {
|
||||
from, to { border-color: transparent }
|
||||
50% { border-color: #07D6FF }
|
||||
}
|
||||
|
||||
@-moz-keyframes typing {
|
||||
from { width: 100% }
|
||||
to { width:0 }
|
||||
}
|
||||
|
||||
@-moz-keyframes blink-caret {
|
||||
from, to { border-color: transparent }
|
||||
50% { border-color: #07D6FF }
|
||||
}
|
||||
|
||||
h1 {
|
||||
position: relative;
|
||||
float: left;
|
||||
font-size:350%;
|
||||
font-family: Inconsolata, Courier, monospace;
|
||||
}
|
||||
|
||||
h1 span {
|
||||
position:absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width:0;
|
||||
background: #fff; /* same as background */
|
||||
border-left: .1em solid #07D6FF;
|
||||
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
-webkit-animation: typing 10s steps(10, end), /* # of steps = # of characters */
|
||||
blink-caret 1s step-end infinite;
|
||||
-moz-animation: typing 10s steps(10, end), /* # of steps = # of characters */
|
||||
blink-caret 1s step-end infinite;
|
||||
}
|
||||
65
oldcrap/style.css
Normal file
65
oldcrap/style.css
Normal file
@@ -0,0 +1,65 @@
|
||||
body {font-family: Helvetica, Arial, sans-serif;}
|
||||
h1 {font-size: 600%;}
|
||||
/*.char2, .char3, .char4, .char5, .char6, .char7, .char8, .char9, .char10, .char11 {color: fff;}*/
|
||||
.char1, .char2, .char3, .char4, .char5, .char6, .char7, .char8, .char9, .char10 {
|
||||
color: #fff;
|
||||
border-right: 6px solid transparent;
|
||||
-webkit-animation: typing .5s;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
}
|
||||
.char10 {
|
||||
color: #fff;
|
||||
padding-right: 2px;
|
||||
border-right: .1em solid transparent;
|
||||
-webkit-animation: typing 1s infinite;
|
||||
}
|
||||
|
||||
.char1 {
|
||||
-webkit-animation-delay: .5s;
|
||||
}
|
||||
.char1::after {
|
||||
-webkit-animation-delay: 1s;
|
||||
}
|
||||
.char2 {
|
||||
-webkit-animation-delay: 1.5s;
|
||||
}
|
||||
.char3 {
|
||||
-webkit-animation-delay: 2s;
|
||||
}
|
||||
.char4 {
|
||||
-webkit-animation-delay: 2.5s;
|
||||
}
|
||||
.char5 {
|
||||
-webkit-animation-delay: 3s;
|
||||
}
|
||||
.char6 {
|
||||
-webkit-animation-delay: 3.5s;
|
||||
}
|
||||
.char7 {
|
||||
-webkit-animation-delay: 4s;
|
||||
}
|
||||
.char8 {
|
||||
-webkit-animation-delay: 4.5s;
|
||||
}
|
||||
.char9 {
|
||||
-webkit-animation-delay: 5s;
|
||||
}
|
||||
.char10 {
|
||||
-webkit-animation-delay: 5.5s;
|
||||
}
|
||||
.char11 {
|
||||
-webkit-animation-delay: 6s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes typing {
|
||||
from, to {color: #333; border-color: #07D6FF; }
|
||||
/* 25% {border-color: transparent; }
|
||||
75% {border-color: #07D6FF;}*/
|
||||
to {color: #333; border-color: transparent;}
|
||||
}
|
||||
|
||||
box.addEventListener( 'webkitTransitionEnd',
|
||||
function( event ) { alert( "Finished transition!" ); }, false );
|
||||
|
||||
|
||||
|
||||
48
oldcrap/typing.html
Normal file
48
oldcrap/typing.html
Normal file
@@ -0,0 +1,48 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>Typing, Ma!</title>
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/lettering.js"></script>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$(".page-title").lettering();
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
body {font-family: Helvetica;}
|
||||
h1 {font-size: 100px;}
|
||||
|
||||
.char1, .char2, .char3 {
|
||||
color: #fff;
|
||||
border-right: .1em solid transparent;
|
||||
-webkit-animation: typing .5s;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.char1 {-webkit-animation-delay: .5s;}
|
||||
.char2 {-webkit-animation-delay: 1s;}
|
||||
/* or whatever your last character is */
|
||||
.char3 {
|
||||
padding-right: 2px;
|
||||
-webkit-animation: typing 1s infinite;
|
||||
-webkit-animation: blink 1s infinite;
|
||||
-webkit-animation-delay: 1.5s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes typing {
|
||||
from, to {color: #333; border-color: transparent; }
|
||||
70% {color: #333; border-color: #07D6FF; }
|
||||
}
|
||||
|
||||
@-webkit-keyframes blink {
|
||||
from, to {color: #333; border-color: transparent; }
|
||||
50% {border-color: #07D6FF;}
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1 class="page-title">Hi.</h1>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user