GM_config

By JoeSimmons Last update Feb 26, 2011 — Installed 1,031,377 times.

Collapsible section headings

in
Subscribe to Collapsible section headings 8 posts, 3 voices



ViXaY Xavier Scriptwright
FirefoxWindows

Is it possible to have this?

Currently the section text also gets formatted with the background and it looks ugly.
see http://imgur.com/BEpYo.png

suggested fix?

 
sizzlemctwizzle Scriptwright
FirefoxMacintosh

You can script this yourself using callback functions as described here and here. It wouldn't be something we'd put in GM_config. As for the ugliness. The version I maintain on google doesn't put the descriptions in the h2 section header tag, because I think it looks weird. I don't know why Joe chooses to leave it that way.

 
JoeSimmons Script's Author
FirefoxWindows
sizzlemctwizzle wrote:
The version I maintain on google doesn't put the descriptions in the h2 section header tag, because I think it looks weird. I don't know why Joe chooses to leave it that way.
I wasn't aware yours did this.

Version 1.1.9 has separate headings and heading descriptions, some 6px bottom margins to the config vars, and type:'hidden' has been added along with bugfixes.


On a side note... Sizzle, you should update the google code to my latest version. It's more stable and has more features.
 
ViXaY Xavier Scriptwright
FirefoxWindows

btw i had achieved what i wanted using this code (uses jquery). for future reference.

      open: function() {
        var allsections = $('#GM_config').contents().find('.section_header_holder');
        //create a toggle all link
        allsections.eq(0).before('Toggle All Sections');
        allsections.prev('a').click(function(eventObj){
          $(this).nextAll().find('div.config_var').toggle();
          $(this).nextAll().find('.section_header').toggleClass('collapsed');
        });
        // bind section headings to toggle the display of the section
        allsections.prev('a').nextAll()
          .find('.section_header')
          .attr('title','click to expand/collapse section')
          .click(function(eventObj){
          $(this).nextAll('div.config_var').toggle();
          $(this).toggleClass('collapsed');
        });
        //align all labels - not working right now
        allsections.each(function () {
          $(this).find('label').autoWidth();
          //$(this).find('.field_label').autoWidth();
        });
        nHtml.Click(allsections.prev('a')[0]); //click the toggle all button
      },

 
sizzlemctwizzle Scriptwright
FirefoxMacintosh

JoeSimmons wrote:
you should update the google code to my latest version
Done
ViXaY Xavier wrote:
uses jquery
eww... but I'm glad you got it to work.

 
ViXaY Xavier Scriptwright
FirefoxWindows

Anyway to get the label/field alignment to work?

see http://www.jankoatwarpspeed.com/post/2008/06/06... for a good discussion on good layout design.

see http://s3.amazonaws.com/uso_ss/3563/large.png?1... for the layout right now.

 
JoeSimmons Script's Author
FirefoxWindows
ViXaY Xavier wrote:
Anyway to get the label/field alignment to work?
I want the fields to be on the left. I might move the header texts to the left though.
 
sizzlemctwizzle Scriptwright
FirefoxMacintosh

JoeSimmons wrote:
I might move the header texts to the left though.
That might look better.

Cross
Presentational HTML allowed.
Use <code> for inline code and <pre> for code blocks. Use &lt; and &gt; for literal < and >.
We help break paragraphs and link your links.
or cancel