jquery mb.containerPlus


Let your content look great!

This is a useful plug in to build full featured and fully skinnable containers. The container can be set to draggable, resizable, collapsable and minimizable.

v. 3.5.5

What’s new in 3.5.5:

  • Added “autoresize” method to adapt the container to the height of the content.
  • refined the “rememberMe” behavior.

What’s new in 3.5.4:

  • Added compatibility with IE11.
  • Refined the behavior of the container if initialized as “iconize”.

419 Responses

  1. Mohammad
    Mohammad at · Reply

    i apologize for my language :”>

    i use this good Component for my new website (it is in my local-host)

    i didn’t set the height of main panel to automatically increase its height when my contents are too long.

    but now(!) i see that the page do not Scroll when the container height is longer than the window.

    thank you for your helps.

    best regards.

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Mohammad,
      it sounds strange, if you try on the demo to set a container height very hight it works fine and the page can scroll;
      don’t you have set on your css body{ overflow: hidden}? or something like that?

  2. Rafik
    Rafik at · Reply

    Hi Matteo,
    first thanks a lot for this great job, I’ve a questions about elementsPath, I noticed that if I move this folder to another location for exemple(my image folder) /img/elementsPath and I use this path to build the container it does’t work, i found another location in the mbcontainer.js using default reference path,

    Is there any work around to that or is there another place what i must change.

    Thanks again mat.


    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Rafik,
      the elementsPath is relative to the page location, so if your image folder on the samelevel of the page where you are using containers elementsPath could be: “myImageFolder/”; but if it is in another location you have to specify the path starting from your page.
      for example:
      the page is: index.html on the root of your site;
      the image folder is: media/images/containerPlus/
      elementsPath is: media/images/containerPlus/

      the page is: portfolio/myWorks.html
      the image folder is: media/images/containerPlus/
      elementsPath is: ../ media/images/containerPlus/

      Hope this can help you,

  3. jQuery (mb)Containers 1.2 « Matteo Bicocchi’s Blog

    […] This plugin has been deprecated. If you are looking for a container plugin get this one: mb.containerPlus […]

  4. Guillaume
    Guillaume at · Reply

    Hello, i’ve a problem. I already explain you, but i can’t understand why does it occured.
    When i move container on the screen, there isn’t any screen limit. The container isn’t blocked by the edge of the screen. I dont understand why.
    My page contains a jqueryFileTree, and several button.
    When i removed everything in the page and just keep the container on, its okay, but it seems that the presence of other things on the page create the problem (its quite strange isn’t it ? 😉 )

    Thank you for your good work, it’s very nice tu implements container with ajax 🙂 i like it

    1. Guillaume
      Guillaume at ·

      Ok i fixed the problem. I just open and close the container before the $(document).ready function invocation wich define the assignation of a $(td).click( function: open the container via a js called) its quite strange but it work.

  5. mb.containerPlus: updated to relase 2.3.2 « Matteo Bicocchi’s Blog

    […] To get the latest version go to the component page. […]

  6. Davide
    Davide at · Reply

    hi, first of all: your work is amazing!

    btw, it sounds a little weird speaking english with another italian 🙂

    i was wondering if there is a way to pass values to a module to another one (i mean: searches and things like that).

    is that possible?

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Ciao davide,
      i container hanno un metodo che permette di caricare un contenuto via ajax on the fly, assando i parametri che vuoi: jQuery.fn.mb_changeContainerContent(url,data);
      Quindi puoi invocarla quando ti serve semplicemente $(“# IDdelContainer”).mb_changeContainerContent(“laTuaPaginaDinamica”,”iDatiCheVuoiTrasmettere”);

  7. Renan
    Renan at · Reply

    Hi man!

    First, congratz for your component. It’s really great!

    Now, i got a little problem, can you help?

    I have a container, and inside it i have an iframe.
    I want to put some buttons INSIDE the iframe to control the container!

    So, inside my iframe i want to Iconize, Minimize or Close the Container!

    Can you help me find out how to do that?


    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Renan,
      this kind of scripting is allowed only if the top page and the iframe content are from the same domain, otherwise whould became cross domain scripting and all the browsers doesn’t allow that for security reasons.
      Anyway in the iframe page content you can refer to all the functions in the opener as window.parent.YourFunctions();; so in your case you can write something like: window.parent.$("#yourContainerID").mb_close()

      Hope this can help you,

  8. Black
    Black at · Reply


    When i upgrade to 2.2 or 2.3.1 versions – event onClose did not work when i use method mb_close() but when i clicked on “close” button all ok …

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi black,
      you find a bug, thnx;
      all the external methods doesn’t have any callback function.
      I’ll fix this problem for next release.

    2. Black
      Black at ·


      While you fix bug i add next lines

      jQuery.fn.mb_close = function (){
      if ($(this).attr(“closed”)==”false”){

  9. mb.containerPlus 2.3.1 « Matteo Bicocchi’s Blog
    mb.containerPlus 2.3.1 « Matteo Bicocchi’s Blog at ·

    […] mb.containerPlus […]

  10. jQuery (mb)ContainersPlus 2.2 (iconize where you want!) « Matteo Bicocchi’s Blog

    […] mb.containerPlus […]

1 2 3 21

Leave a Reply