Skip to content

Instantly share code, notes, and snippets.

View matharchod's full-sized avatar

Jani Momolu Anderson matharchod

4 followers · 5 following
View GitHub Profile
@matharchod
matharchod / Liquid Layout - Change Classes Based on Width of Browser Window
Created October 18, 2011 20:37
A core JavaScript liquid layout function that checks the current width of a browser window and assigns a new class to the BODY accordingly.
//LIQUID LAYOUT
function setScreenClass(){
var fmt = document.documentElement.clientWidth;
var cls = (fmt>640&&fmt<=800)?'screen_low':(fmt>800&&fmt<=1024)?'screen_med':(fmt>1024&&fmt<=1280)?'screen_high':(fmt>1280)?'screen_wide':'screen_low';
document.body.className=cls;
};
@matharchod
matharchod / Animated Toggle Function
Created October 19, 2011 19:40
A jQuery toggle function that uses callbacks to animate elements in a particular order.
/* SET #PORTFOLIO TOGGLE */
$("#portfolio_toggle").toggle(
function(){
portfolioOpen();
},
function(){
portfolioClose();
}
);
@matharchod
matharchod / Custom jQuery Easing Function
Created October 19, 2011 23:16
A custom jQuery easing function called "comicSwing". I use it on my portfolio site for my jQuery scrollables.
// custom easing called "comicSwing"
$.easing.comicSwing = function (x, t, b, c, d) {
var s = 1.5;
if ((t/=d/2) < 1) return c/5*(t*t*(((s*=(1.525))+1)*t - s)) + b;
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
}
@matharchod
matharchod / Busy Message - CSS Switcher on a Timer
Created October 19, 2011 23:26
A jQuery function that creates a "busy" message for 10 seconds by switching CSS classes on multiple elements simultaneously.
//BUSY MESSAGE
function busy() {
var x = $('#header a, #portfolio a');//ALL ELEMENTS TO BE AFFECTED
$(x).addClass('busy');
setTimeout(function(){
$(x).removeClass('busy').addClass('ready');
}, 10000);
}
@matharchod
matharchod / Fade In a Group of Elements One Element At a Time
Created October 19, 2011 23:30
A jQuery function that fades in a group of elements (i.e. a group of LIs) one element at a time, in succession.
/* FADE IN TEXT */
$('.fader').delay(0).each(function (i){ //SELECTS ALL ELEMENTS WITH THE CLASS "FADER"
var me = $(this);
setTimeout(function(){ $(me).fadeIn('slow'); }, (400 * i)); // SETS FADE IN SPEED AND DELAY BETWEEN EACH
});
@matharchod
matharchod / jQuery Modal Popup Script
Created October 21, 2011 19:34
A jQuery script that uses jQuery UI, Modal Popups and Cookies to show content based on a timer and/or a cookie value: used as a way to serve modal content through a JavaScript ad server.
//AD MODALS
function myModalClose() {
$('.myOverlay, #exposeMask').fadeOut('slow');
$('.ad').css({'position':'relative','margin-left':'auto'}); //SHOW ADS
};
function myModalPop(type,timer,target,link,creative,width,height) { //setup for variables coming from ad server script
var date = new Date();
@matharchod
matharchod / Site Skin and Background Image Swapper for Takeover Ads
Created October 21, 2011 19:43
A script that uses core JavaScript & jQuery to change the BODY background image and add a transparent link over the background of the page.
//Ad SKINS
function loadAdSkinBkg(bgrnd_skin_bgColor,bgrnd_skin_imageSrc,bgrnd_skin_linkTarget){
$('body','html').css({"background-image":"none","background-color":bgrnd_skin_bgColor});
$('body','html').css({"background-image":bgrnd_skin_imageSrc, "background-position":"center top","background-repeat":"no-repeat"}).prepend('<a id="skin_background" href="'+ bgrnd_skin_linkTarget+'" target="_blank">&nbsp;</a>');
$.getDocHeight = function(){
return Math.max(
$(document).height(),
$(window).height(),
document.documentElement.clientHeight
);
@matharchod
matharchod / jQuery Cookie Reader Script
Created October 21, 2011 19:55
A jQuery script that checks the value of a cookie and creates a new cookie plus appends an additional value with "&" as a delimiter to the cookie value. Dependent on cookie.js plugin.
@matharchod
matharchod / vCenter.js
Created January 10, 2012 23:14
A jQuery script for vertical centering
function vcenter(a, b) {
var wHeight = $(window).height();
var fHeight = $(a).height();
var nHeight = (wHeight / 2) - (fHeight);
if (!b || b == "" || b == null) {
var b = a;
}
$(b).css({
'position' : 'relative',
'top' : nHeight
@matharchod
matharchod / window_measure.js
Created January 12, 2012 22:10
JSON object that uses jQuery to get width and height of viewport
var measure = {
'num' : 9,
'wHeight' : function(){
var h = $(window).height();
return h;
},
'wWidth' : function(){
var w = $(window).width();
return w;
},