I love the "show-grid" body class, but sometimes you don’t want to see the pretty grids when you developing.
As it is right now, you have to edit your subtheme body tag and remove or rename the "show-grid" class to disable the grids, then add it or rename is to show-grid again.

I was tired of doing that every time I wanted to see how the site really looked without the grids, so I made a little JS-Snippet.

Include the js-file in your subtheme and press "shift + g" to toggle.
To include this, edit your .info theme file and paste this

; The grid toggle javascript
scripts[] = gridtoggle.js

If you are in a or an the script will not toggle (It will think you are typing as usually).

It’s tested on my Windows XP machine with

  • IE8
  • IE7 (compability mode in IE8)
  • FF 3.6

    • vChrome 4.0.249.78

  • Safari 4.0.3

I have no good idea how to integrate this in a smart way if the maintainers decide to include this in future releases.

// Emil

Comments

anon’s picture

anon
Primary language Swedish
Location Gothenburg
commented
Title: Toggle gird with js » Toggle grid with js
anon’s picture

anon
Primary language Swedish
Location Gothenburg
commented

Demo http://anon-design.se/demo/toggle-ninesixty-theme-960-grids-with-js

PMorris’s picture

PMorris commented

Love using this script! I changed it a bit so it would work in Drupal 7 which won't let you use document.ready. Note: "YOURTHEME" should be changed to your theme name


/**
 * $Id:$
 *  
 * Toggle grid for ninesixty
 * Created by: Emil Stjerneman - <http://www.anon-design.se> (anon - <http://drupal.org/user/464598>)
 *
 * Press "shift + g" to toggle 
 */


(function($) { 
Drupal.behaviors.YOURTHEME = {
attach: function(context, settings) {

$(document).keypress(function(e){
    var target = e.target || e.srcElement;
    // Defeat Safari bug 
    if (target.nodeType==3) { 
      target = targ.parentNode;
    }
    // Prevent toggle of you are in a textarea for input field.
    if(target.tagName != "TEXTAREA" && target.tagName != "INPUT" && e.which==71 && e.shiftKey) {
      $('body').toggleClass('show-grid');
    }    
  });

}
}
})(jQuery)
nickgs’s picture

nickgs commented

This rocks guys!!

Thanks!!

Nick