murtaugh

$(window).scroll(function(e){
	parallax();
});


function parallax() {
	
	var scrolled = $(window).scrollTop();
    
    	//81% is the original top position of the element,

murtaugh

<figure class="text full-width">
<p data-height="388" data-theme-id="0" data-slug-hash="BJrpg" data-default-tab="result" class='codepen'>See the demo: <a href='http://alistapart.com/d/390/ui-animation-and-ux-a-not-so-secret-friendship/demo-show-hide'>Show/hide example</a></p>
<script async src="//codepen.io/assets/embed/ei.js"></script>
<figcaption>Select items on the main nav to reveal the submenus.</figcaption>
</figure>

murtaugh

I was thinking about restaurant menus, and started wondering how best to mark up individual items on the menu. Assuming you're going to put the each item in an li one approach could be:

<li>
	<h2>Home-Style Burger</h2>
	<p>half-pound burger with grilled onions</p>
	<p class="price">$7.25</p>
</li>	

murtaugh

$.wait = function( callback, seconds){
   return window.setTimeout( callback, seconds * 1000 );
}

// usage
$.wait( function(){ $("#message").slideUp() }, 5);

murtaugh

$('sup[data-footnote]').each(function(index) {

	noteCount = $(this).html();

	$(this).html('<a id="ref' + noteCount + '" href="#note' + noteCount + '">' + noteCount + '</a>');
	
	$('#footnotes li').eq(noteCount - 1).attr('id', 'note' + noteCount).prepend('<a href="#ref' + noteCount + '">' + noteCount + '.</a> ');

});

murtaugh

if (!Modernizr.input.placeholder) {
	
	$('*[placeholder]').each(function() {
	
		placeholder = $(this).attr('placeholder');
		
		$(this).attr('value', placeholder).addClass('fakePlaceholder');	
		
	});

murtaugh

.columns {
	display: block;
	list-style-type: none;
	margin-bottom: 24px;
	-moz-column-count: 2;
	-moz-column-gap: 24px;
	-webkit-column-count: 2;
	-webkit-column-gap: 24px;
	column-count: 2;
	column-gap: 24px;

murtaugh

<figure class="code">
<pre><code class=“language-markup”>&lt;meta charset="utf-8"/></code></pre>
<figcaption>A UTF-8 encoding declaration should appear at the beginning of every &lt;head&gt; element.</figcaption>
</figure>

murtaugh

$(document).ready(function() {
    
    $("#in-page-nav-1 a").click(function(e){
		
		e.preventDefault();
		
		var dest = 0;

		if ($(this.hash).offset().top > $(document).height()-$(window).height()){

murtaugh

(function($){

$(document).ready(function (){

  $('textarea[data-autoresize]').on('input propertychange', function() {
		
		autoResize($(this));
		
	});