Skip to content

Instantly share code, notes, and snippets.

@rayantony
Last active March 19, 2016 10:35
Show Gist options
  • Select an option

  • Save rayantony/8c9cde898dd4a09c4ed4 to your computer and use it in GitHub Desktop.

Select an option

Save rayantony/8c9cde898dd4a09c4ed4 to your computer and use it in GitHub Desktop.
hollyweed bcard sample
<html><head><title>Hollyweed | Hollywood Medical Marijuana Delivery Service</title>
<style>@import url(http://fonts.googleapis.com/css?family=Petit+Formal+Script:900,300,700);@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700,900);@import url(http://fonts.googleapis.com/css?family=Righteous:400,300,700,900);
</style>
<link rel="stylesheet" href="http://codepen.io/rayrc/pen/dae9055225ce25daa96829e0ec97ed23.css">
<!-- jQuery: Grab Google CDN jQuery. fall back to local if necessary -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>!window.jQuery && document.write('<script src="https://raw.githubusercontent.com/zurb/jquery-raptorize/master/jquery-1.8.0.min.js"><\/script>')</script>
<!-- The raptorize file -->
<script src="https://raw.githubusercontent.com/zurb/jquery-raptorize/master/jquery.raptorize.js"></script>
<!-- For the button version -->
<script type="text/javascript">
$(window).load(function() {
$('.button').raptorize();
});
</script>
<script type="text/javascript">
$(window).load(function() {
$('.button').raptorize({
'enterOn' : 'timer',
'delayTime' : 2500
});
});
</script>
<script>
(function($) {
$.fn.raptorize = function(options) {
//Yo' defaults
var defaults = {
enterOn: 'click', //timer, konami-code, click
delayTime: 5000 //time before raptor attacks on timer mode
};
//Extend those options
var options = $.extend(defaults, options);
return this.each(function() {
var _this = $(this);
var audioSupported = true;
//Stupid Browser Checking which should be in jQuery Support
if ($.browser.mozilla && $.browser.version.substr(0, 5) >= "1.9.2" || $.browser.webkit) {
audioSupported = true;
}
//Raptor Vars
var raptorImageMarkup = '<img id="elRaptor" style="display: none" src="https://raw.githubusercontent.com/zurb/jquery-raptorize/master/raptor.png" />'
var raptorAudioMarkup = '<audio id="elRaptorShriek" preload="auto"><source src="https://raw.githubusercontent.com/zurb/jquery-raptorize/master/raptor-sound.mp3" /><source src="https://raw.githubusercontent.com/zurb/jquery-raptorize/master/raptor-sound.ogg" /></audio>';
var locked = false;
//Append Raptor and Style
$('body').append(raptorImageMarkup);
if(audioSupported) { $('body').append(raptorAudioMarkup); }
var raptor = $('#elRaptor').css({
"position":"fixed",
"bottom": "-700px",
"right" : "0",
"display" : "block"
})
// Animating Code
function init() {
locked = true;
//Sound Hilarity
if(audioSupported) {
function playSound() {
document.getElementById('elRaptorShriek').play();
}
playSound();
}
// Movement Hilarity
raptor.animate({
"bottom" : "0"
}, function() {
$(this).animate({
"bottom" : "-130px"
}, 100, function() {
var offset = (($(this).position().left)+400);
$(this).delay(200).animate({
"right" : offset
}, 2200, function() {
raptor = $('#elRaptor').css({
"bottom": "-700px",
"right" : "0"
})
locked = false;
})
});
});
}
//Determine Entrance
if(options.enterOn == 'timer') {
setTimeout(init, options.delayTime);
} else if(options.enterOn == 'click') {
_this.bind('click', function(e) {
e.preventDefault();
if(!locked) {
init();
}
})
} else if(options.enterOn == 'konami-code'){
var kkeys = [], konami = "38,38,40,40,37,39,37,39,66,65";
$(document).keydown(function(e) {
kkeys.push( e.keyCode );
if ( kkeys.toString().indexOf( konami ) >= 0 ){
$(document).unbind('keydown',arguments.callee);
init();
}
});
}
});//each call
}//orbit plugin call
})(jQuery);
</script>
</head><body>
<h1>HollyWeed</h1>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Petit+Formal+Script" />
<h2 class="h2t"></h2>
<nav>
<div class="slider">
<input id="shop" name="view3" type="radio" checked>
<label for="shop" onclick="">Shop</label>
<input id="brands" name="view3" type="radio">
<label for="brands" onclick="">Brands</label>
<input id="about" name="view3" type="radio">
<label for="about" onclick="">About</label>
<input id="contact" name="view3" type="radio">
<label for="contact" onclick="">Contact</label>
<input id="blog" name="view3" type="radio">
<label for="blog" onclick="">Blog</label>
<span class="button"></span>
</div>
</nav>
</body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment