cuth

Debug Horizontal Scroll

(function (d) {
    var w = d.documentElement.offsetWidth,
        t = d.createTreeWalker(d.body, NodeFilter.SHOW_ELEMENT),
        b;
    while (t.nextNode()) {
        b = t.currentNode.getBoundingClientRect();
 if (b.right > w || b.left < 0) {

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

tomhodgins

(function() {
  var myWidget = document.createElement('section'),
      widgetStyles = document.createElement('style'),
      tag = document.querySelectorAll('[src*="myWidget"]')[0];
  myWidget.innerHTML = '\
    <!-- Add your HTML here, with line-breaks escaped by a "\" backslash character. -->\
    <!-- (Don\'t forget: you can escape any character, like quotes, as well -->\
    Hello\
  ';
  widgetStyles.innerHTML = '\

tomhodgins

(function() {
  if (typeof EQCSS === 'undefined') {
    var eq = document.createElement('script');
    eq.src = 'http://elementqueries.com/EQCSS.js';
    document.body.appendChild(eq);
  };
  var myWidget = document.createElement('section'),
      widgetStyles = document.createElement('script'),
      tag = document.querySelectorAll('[src*=\'myWidget\']')[0];
  myWidget.innerHTML = '\

tomhodgins

This is a collection of my most often used lines of code, as well as a few other examples I want to have ready at a moment's notice. These snippets focus on building HTML from scratch, linking in good web fonts, and setting up responsive styles for your pages.

Table of Contents

• HTML Snippets
• Font Snippets
• CSS Snippets
• JavaScript Functions
• Shell Commands

tomhodgins

data-personas
data-default="<?php $dd = get_field_escaped($field); echo $dd; ?>"
<?php
  $field = 'YourTagGoesHere';
  if(get_field($field . '_mm')) {
    $mm = get_field_escaped($field . '_mm'); echo 'data-persona-marketing-maggie="' . $mm . '" ';
  } else {
    $mm = get_field_escaped($field); echo 'data-persona-marketing-maggie="' . $mm . '" ';
  }
  if(get_field($field . '_tt')) {

lolzballs

import java.io.FileDescriptor;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.OutputStream;
import java.io.PrintStream;

public class HelloWorld{
	private static HelloWorld instance;
    public static void main(String[] args){
        instantiateHelloWorldMainClassAndRun();

paulirish

/* bling.js */
window.$ = document.querySelector.bind(document);
window.$$ = document.querySelectorAll.bind(document);
Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); };
NodeList.prototype.__proto__ = Array.prototype;
NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); };

joepie91

// The wrong way:

if (something === true)
	doAThing();
	
// Requirements change, now you need to do two things:

if (something === true)
	doAThing();
	doASecondThing();

tomhodgins

// Add this code to Reddit.com
/* Hide the Side */
if (document.getElementsByTagName('html')[0].classList.contains('reddit')) {
  var input = document.createElement('input'),
      inputCSS = document.createElement('style'),
      inputJS = document.createElement('script');

  input.id = 'hTS';
  input.setAttribute('type','checkbox');
  input.setAttribute('onclick','hideTheSide()');