Skip to content

Instantly share code, notes, and snippets.

View quezo's full-sized avatar

Alex Vazquez quezo

  • CodePen
  • Seattle, WA
View GitHub Profile
@quezo
quezo / index.html
Created August 15, 2012 17:48
A web page created at CodePen.io.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- IF PEN IS PRIVATE -->
<!-- <meta name="robots" content="noindex"> -->
<!-- END -->
@quezo
quezo / index.html
Created August 15, 2012 17:48
A web page created at CodePen.io.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- IF PEN IS PRIVATE -->
<!-- <meta name="robots" content="noindex"> -->
<!-- END -->
@quezo
quezo / index.html
Created August 15, 2012 17:49
A web page created at CodePen.io.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- IF PEN IS PRIVATE -->
<!-- <meta name="robots" content="noindex"> -->
<!-- END -->
@quezo
quezo / index.html
Created August 16, 2012 04:02
A web page created at CodePen.io.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- IF PEN IS PRIVATE -->
<!-- <meta name="robots" content="noindex"> -->
<!-- END -->
@quezo
quezo / index.html
Created August 16, 2012 04:02
A web page created at CodePen.io.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- IF PEN IS PRIVATE -->
<!-- <meta name="robots" content="noindex"> -->
<!-- END -->
@quezo
quezo / index.js
Created August 16, 2012 04:05
A web page created at CodePen.io.
var bkjs = "javascript:function __cp(){var h=document,g=h.createElement("script"),c=h.location,a=h.body;try{if(!a){throw (0)}g.setAttribute('src',c.protocol+'//assets.codepen.io/assets/bk/bk.js?t='+(new Date().getTime()));a.appendChild(g)}catch(f){alert('Try again when the page loads.')}}__cp();void (0);";
$('a').attr('href', encodeURI(bkjs));
@quezo
quezo / markup.html
Created August 16, 2012 04:05
A web page created at CodePen.io.
<h1>Pure CSS3 Toggle Switch</h1>
<input type="checkbox" id="1" class="slider-toggle" />
<label class="slider-viewport" for="1">
<div class="slider">
<div class="slider-button">&nbsp;</div>
<div class="slider-content left"><span>On</span></div>
<div class="slider-content right"><span>Off</span></div>
</div>
</label>
@quezo
quezo / markup.html
Created August 16, 2012 04:14
A web page created at CodePen.io.
<h1>Pure CSS3 Toggle Switch</h1>
<input type="checkbox" id="1" class="slider-toggle" />
<label class="slider-viewport" for="1">
<div class="slider">
<div class="slider-button">&nbsp;</div>
<div class="slider-content left"><span>On</span></div>
<div class="slider-content right"><span>Off</span></div>
</div>
</label>
@quezo
quezo / markup.html
Created August 16, 2012 04:43
A web page created at CodePen.io.
<div id="wrapper">
<div id="shadow"></div>
<div id="down" class="round face">
<div id="front" class="round face">
<div id="content" class="round">
<div id="banner">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="120px" height="239px" viewBox="-20.01 -45.25 120 239" enable-background="new -20.01 -45.25 120 239"
xml:space="preserve">
<defs>
@quezo
quezo / index.html
Created August 16, 2012 04:56
This bookmarklet lets you grab code from tutorials all over the internet and play with them on CodePen. Drag the Codepen box to your toolbar and visit a tutorial. When you click the bookmarklet, it'll highlight all the code examples on the web page.
<h1>Code Pen Bookmarklet</h1>
<p>Drag the box below to your bookmarks toolbar. Then click it when browsing around the internet and find some code you want to play with. You'll be able to select the blocks of code you want by clicking on them and then easily bring them over to CodePen to play!</p>
<div class="bk-highlight">
<a class="bookmarklet" href="">CodePen</a>
</div>