metamn’s gists

metamn / gist:909498

Created April 8, 2011 08:30

	@media only screen and (max-width : 320px) {
	body {
	background: red;
	}
	}


	@media only screen and (min-width : 320px) {
	body {
	background: yellow;

metamn / gist:867309

Created March 12, 2011 15:26

example for the css style guide on shopledge

metamn / button-webkit.html

Created March 12, 2011 12:12

Example on a button / link breaking the design on webkit

metamn / inspiration.js

Created February 8, 2011 18:12

Show larger versions of a thumbnail

	jQuery("#inspiration #item span.original").click(function(){
	var link = jQuery(this).parent().parent().children('img').attr('rev');
	var str = '<div id="item" class="original">';
	str += '<img src="' + link + '" />';
	str += '</div>';
	jQuery(this).parent().parent().after(str);
	});

metamn / feed.liquid

Created February 2, 2011 10:14

Reading a (Shopify) feed with jQuery

	<div id="blog">
	{% assign feed_url = "http://shopledge.myshopify.com/blogs/news.atom" %}

	<script type="text/javascript">
	var api = "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q={{ feed_url }}&num=5";
	jQuery.getJSON(api, function(data){
	// Check for error
	if (data.responseStatus == 200) {
	// Process the feeds
	var feed = data.responseData.feed;

metamn / twitter.liquid

Created February 2, 2011 09:06

Getting Twitter followers with JSONP, jQuery and Liquid

	<div id="items">
	{% assign twitter_id = "metamn" %}
	{% assign twitter_limit = 50 %}

	<script type="text/javascript">
	var counter = 0;
	var BreakException= {};

	try {
	jQuery.getJSON('http://twitter.com/statuses/followers.json?screen_name={{ twitter_id }}&callback=?',function(data){

metamn / mobile.html

Created January 31, 2011 15:19

Load mobile.css when screen size is less than 600px

<link href="/css/mobile.css" charset="utf-8" media="screen and (max-width: 600px)" rel="stylesheet" type="text/css" />

metamn / responsive.html

Created January 31, 2011 12:42

Preparing the browser for responsive web design.

metamn / responsive.js

Created January 31, 2011 12:35

Writing a cookie with the current screen width

	<script language="javascript">
	writeCookie();
	function writeCookie() {
	var today = new Date();
	var the_date = new Date("December 31, 2023");
	var the_cookie_date = the_date.toGMTString();
	var the_cookie = "screen="+ screen.width;
	var the_cookie = the_cookie + ";expires=" + the_cookie_date;
	document.cookie=the_cookie;
	}

metamn / tree display

Created March 5, 2010 13:16

tree display with partials

	index.haml

	%ul
	= render :partial => "category", :collection => Category.roots

	_category.haml

	%li
	= category.name
	- unless category.children.blank?

metamn metamn