Skip to content

Instantly share code, notes, and snippets.

View matherton's full-sized avatar

Mark Atherton matherton

3 followers · 10 following
View GitHub Profile
@matherton
matherton / nav.css
Created September 16, 2012 14:24
horizontal sprite navigation with HTML5 tags
#nav {
background:url("images/sprite_nav.png") no-repeat;
width: 962px; /* width of sprite */
height: 73px; /* half height of sprite */
margin: 0;
padding: 0;
}
/* display each list item block with a height of 73px - display block allows re-sizing */
#nav li, #nav a {
@matherton
matherton / responsive-email.html
Created February 17, 2013 13:15
This is a file I created this morning to figure out how media queries work for responsive emails
<style type="text/css">
@media only screen and (max-device-width: 480px) {
/* mobile-specific CSS styles go here - max-devise-width property only works on apple, Amazon Kindle Fire, Android 2.2+, Microsoft Windows Phone 7.5+ mail clients */
table[class=contenttable] {
width: 320px !important;
}
p {
background-color: #000;
}
}
@matherton
matherton / responsive
Created April 30, 2013 13:54
Responsive Youtube Video
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
@matherton
matherton / plugin structure -> DemoPlugin
Created June 28, 2013 09:09
Worpress OO Plugin template
// http://wp.tutsplus.com/tutorials/plugins/two-ways-to-develop-wordpress-plugins-object-oriented-progamming/
class My_Widget extends WP_Widget {
public function __construct() {
// widget actual processes
}
public function form( $instance ) {
// outputs the options form on admin
@matherton
matherton / drag.html
Created September 18, 2013 09:07
Draggable jQuery Div with callback functions (comments included)
<html>
<head>
<title>Dragable Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="ui.js"></script>
<style>
.item {
height: 180px;
@matherton
matherton / GA.php
Last active December 23, 2015 19:29
GA E-commerce PHP tracking code
public function getGoogleAnalytics ()
{
$googleid = Config::getConfig()->getPreference('googleAnalyticsCode');
$basketWidget = $this->getWidget('basket');
$clientData = $this->getClientDataForOrderReview($clientID);
$orderData = $this->getOrderData($basketWidget,$clientData);
@matherton
matherton / showHide.js
Last active December 29, 2015 00:28
Show and hide JS with no jQuery
function toggle(id) {
var element = document.getElementById(id);
if(element.style.display == "block")
hide(id);
else
show(id);
}
@matherton
matherton / test-jquery.html
Created January 22, 2014 10:25
Example of how to do a simple AJAX injection of a datepicker field on an onClick event. NOTE requires to be run on a server (I use Apache) and the file being injected is stored in a test folder.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="../css/ui.css">
</head>
<body>
<div id="tempload"></div>
<button id="btntest" name="btntest">test</button>
@matherton
matherton / unlinked-search
Last active January 4, 2016 02:39
Bash script to find unlinked files in a directory
@matherton
matherton / HTML5template
Last active January 4, 2016 02:39
Basic HTML5 page template
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<!-- The page title that is displayed in the top of the browser -->
<title>The HTML5 Herald</title>
<!-- Meta content describes your page and is indexed by search engines such as Google -->
<meta name="description" content="The HTML5 BASE template">