Symphony.

Except I am struggling to incorporate a slideshow which already works with Mootools 1.11.

I'm not sure where to download 1.11 now, but it was available on a "choose the components you need" basis like 1.2 is currently, so the version packaged with the Fliud 960 GS ensemble might be missing some dependencies that your slideshow requires. I suggest you try replacing the mootools.js file with one you've used with the slideshow, or if that fails, see if there's an updated version of the slideshow JS that will work with Mootools 1.2.

Thanks very much, Scott. Last night I decided to try for a level playing field and linked everything to the Google Ajax API library, acting as my core mootools file. That made a difference and once I rearranged the order of the individual js files, I got everything playing nicely together. Result! However, I felt bad not using motools 1.2 In fact I already use the mootools slideshow from Electric Prism in another, older project and I wanted to upgrade it to 1.2
But wait, this is the good bit. When I tried Stephen's template with mootools 1.2 everything seemed to work just fine without any extra tweaks (that was just really lucky as I was prepared for a lot of grief to try and update the accordion etc). This meant I could use the the new 1.2 version of the slideshow instead of my existing install and all is well. I think. ...except... if anyone sees a flaw in this plan (ie. mootools 1.2 with Stephen's code) I'd be really interested to hear more.

Is this tested in IE6? I gives weird behaviors in IE6

More likely, IE6 is what's giving weird behaviors ;)

Solved most of them :)

@freshface

would you mind sharing what you did to solve the weird behavior in IE6?

I'm new to the Fluid 960GS, so perhaps I don't quite know how to use it. Please forgive the newbie question.

I'm using v1.0.2 and I'm using the demo file (index.html) as a template.

When I try to modify it by removing some components, the "fluid" functionality is lost. For example, if I delete the search section, everything below the search, such as the Login Forms and Articles lose their fluid, "accordion" ability. They become static.

That is, I deleted the following piece of code:

      < h2>
        < a href="#" id="toggle-search">Search< /a>
      < /h2>
      < div class="block" id="search">
        < form method="get" action="/cgi/perlfect/search/search.pl" class="search">
          < p>
            < input name="p" value="1" type="hidden">
            < input name="lang" value="en" type="hidden">
            < input name="penalty" value="0" type="hidden">
            < input class="search text" name="q" type="search">
            < input class="search button" value="Search" type="submit">
          < /p>
        < /form>
      < /div>
    < /div>

And every component below the Search stopped functioning.

The same behavior occurs across the board. If I delete the "Paragraphs" section, everything below it including Ajax Content, Section Menu and List Items lose their ability to expand and collapse.

Am I doing something incorrect? Or is there a known bug? Or is there a version of F960GS with a fix? Thanks in advance.

If you are going to delete elements from the layout, the changes must also be reflected in the JavaScript file. Find the JavaScript file:

  /fluid960gs/js/fluid16.gs

Then, delete the code that refers to the #search div:

  // Toggle Search
  var search = new Fx.Slide('search');
  $('toggle-search').addEvent('click', function(e) {
    e = new Event(e);
      search.toggle();
    if ($('toggle-search').hasClass('hidden')){
      $('toggle-search').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-search').removeClass('visible').addClass('hidden');
    }
    e.stop(); 
  });

Thank you Stephen! It worked perfectly.

There's a growing interest in the Fluid 960 Grid System at my workplace and amongst a growing band of web developers in the city, primarily because the F960GS is much more flexibly and fluid than it's competitors such as Blueprint, YAML, Emastic and Yahoo UI Grids.

Is there a long-term plan to enhance it? Or are there other forums and usergroups who are actively involved in working with it and enhancing it?

Thanks again!

JohnC

Glad to hear about the growing interest.

Regarding long-term plans, I have wanted to build on the initial idea and create a Symphony theme that could be used for fast prototyping of site and application layouts. Already noted is the need to test and debug for IE6. Another thought would be to create another version based on the jQuery framework.

Lately, my work has been keeping me from exploring the system further. But I'm hoping that upcoming projects will give me a chance to put the system to good use.

Do you have any other specific requests for enhancing the Fluid 960 Grid System?

Love the templates, although I use the KohanaPHP framework mostly.

I've been working on a port to JQuery if anyone is interested, and bauhouse is ok with it, I'm happy to share.

Mubs

@iisbum, feel free to share. I welcome anyone's efforts to build on what I've done, as I am just building on the work of others. I am very interested to see your port to jQuery.

Great Job !!

Unfortunately I encouter an issue with IE 6/7 when resizing window (fluid grid only).

Boxes have strange behaviour...

Any chance you can throw this onto GitHub or something so we (OK, I. Yes, I'm lazy) don't have to keep checking this thread for updates?

All right I posted my JQuery port here: http://www.mostinspired.com/blog/2009/01/28/rapid-interactive-prototyping/

@kennethlove: I love the idea of a centralized location for tracking these templates.

(Hi Mubs — we meet again! Remember CSS Galleries? :-P)

DesignInfluences Traffic Spike

So... traffic to my site just spiked (Google Analytics registered 245 visits on 26 Jan 2009 and 4,687 visits on 27 Jan 2009). It looks like this project is going to need some attention, specifically debugging for IE6.

One of my heroes, Dave Shea at mezzoblue.com just commented on the Fluid 960 Grid System. Along with a whole lot of others:

• 960.gs
• metafilter.com
• delicious.com
• twitter.com

I had hoped that I could direct some traffic to Symphony to help promote my favourite open source web publishing system. If I commit the code for fluid960gs to GitHub, will that cause traffic to bypass the Overture forum? I guess we'll soon see:

Fluid 960 Grid System on GitHub

Clone a local repository of the Fluid 960 Grid System from GitHub:

• http://github.com/bauhouse/fluid960gs/tree

@nick: good to see you around, wondered what happened to css-galleries.

@bauhouse: let me know if you want me to add the jquery versions to your repo, otherwise i'll track them elsewhere.

@iisbum: I'm just getting acquainted with the workings of Git. Would it be best to create a new branch for the jQuery version?

It also seems like a good time to start developing a Symphony 2.0 ensemble using the grid system. Then, what would be the best way to manage ensembles on Git? Should each ensemble be a fork of the symphony-2 repository?

hey iisbum,

I took the liberty of refactoring some of your jQuery, just so you know the accordion doesn't seem to work.

$(function(){

$("#paragraphs, #loading, #ajax-content").hide();

$('.kwicks').kwicks({  
    max : 485  
});

$("#toggle-ajax.hidden").bind("click", function(event){  
    $('#loading').show();
    $("#ajax-content").load("ajax-response.html", function(){
        $('#loading').hide();
    });
    event.preventDefault();
});

$(".hidden,.visible").bind("click", function(event){  
    $(this).hasClass("hidden") ? $(this).removeClass('hidden').addClass('visible') : $(this).removeClass('visible').addClass('hidden');
    $(this).parent().next().slideToggle();
    event.preventDefault();
});

$("dd").hide().filter(":first").show();
$("dt").bind("click", function(event){
    $("dd:visible").slideUp("slow");
    $(this).next().slideDown("slow");
    event.preventDefault();
});

});