Matteo Bicocchi's Blog

mb.ideas.repository

Archive for the ‘jquery’ Category

jQuery.mb.containerPlus 2.4.7 is Out!

with 7 comments

A major update of mb.containerPlus is Out!

2.4.7 minor and major issue and bugfix:
1. added minWidth and minHeight to be setted as metadata of the container.
2. modified onClose callback to be executed after the transition effect.
3. added onBeforeClose callback to be executed before the close transition effect.
4. now the resize event of a container into a dom element take care of the containment.
5. added alwaysOnTop metadata param to mantain the container always on top.
6. added mb_setFixedPosition() method to set fixed position on the fly.
7. fixed a bug in mb_setCookie() with expire date.
8. Added a dockedIconDim param to set the dimension of docked icons.
9. Fixed a bug that if the container hasn’t a height set, once restored from minimized, it still expand its contenet without showing scrollbars.

Get it now: http://pupunzi.open-lab.com/mb-jquery-components/mb-containerplus/

Written by Matteo Bicocchi

26/02/2010 at 7:32 pm

A free Q&A service for your jQuery components

with 3 comments

imageAdd FREE and quality Q&A for your jQuery component HERE

My components suite mb.components benefits greatly from the Q&A service which we bought from StackExchange services. We decided to offer to all jQuery component developers free hosting on the jquery.pupunzi.com service.

What you get: if you link your components site to jquery.pupunzi.com,

1. you get the best online Q&A service you can get: see stackoverflow.com.
2. we will add a home page banner pointing to your components site, as in the picture on the left.

You should link from your site filtering by the “root” tag concerning your component, e.g.

http://jquery.pupunzi.com/questions/tagged/jquery.mb.scrollable

Why we do this: it is a way to get more visibility to our (and your) component by “sharing” users. It is also a way to share answers and experts on jQuery components.

How to proceed: write me an e-mail at info at open-lab dot com, and I’ll get back to you.

Written by Matteo Bicocchi

25/01/2010 at 11:41 am

Posted in code, javascript, jquery

Tagged with ,

mb.gallery 2.0, next on pupunzi.com

with 2 comments

here is a short video of the forthcoming mb.gallery 2.0 jQuery plugin.

Written by Matteo Bicocchi

21/01/2010 at 9:19 pm

What is new in jQuery 1.4. Features for a happy programming

with 7 comments

jQuery team have done a great work  in this new 1.4 release.

The new release of jQuery has come out with many new features and code optimization (http://api.jquery.com/category/version/1.4/) to ease manipulate and traversing DOM elements.
The most impressive improvement is internal calls reduction to perform jQuery methods, with a significant increase in performance:

jquery 1.3.2 v. 1.4 performance

jquery 1.3.2 versus 1.4 performance

Lets take a closest look at some useful changes

  • All setter method now accept a function as value:

    .css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .before(), .after(), .replaceWith(), .wrap(), .wrapInner(), .offset(), .addClass(), .removeClass(), and .toggleClass().

    $('div.demo-container').html(function() {
     var emph = '' + $('p').length + ' paragraphs!';
    return 'All new content for ' + emph + '';
    });
  • Quick Element Construction:

    When you create a single element with the jQuery function, you can now pass in an object to add attributes and events at the same time:

    jQuery("<div/>", {
    id: "foo",
    css: { height: "50px", width: "50px", color: "blue", backgroundColor: "#ccc" },
    click: function() { $(this).css("backgroundColor", "red");  }
    }).appendTo("body");
  • Event Multi-binding:
    You can now pass an object of many events to bind to an element:

    $("div.test").bind({
    click: function(){ $(this).addClass("active"); },
    mouseenter: function(){ $(this).addClass("inside"); },
    mouseleave: function(){ $(this).removeClass("inside"); }
    });
  • All Events Can Be Live Events:
    Has been introduced cross-browser support for change, submit, focusin, focusout, mouseenter, and mouseleave via the event delegation in .live(). Note that if you need a live focus event, you should use focusin and focusout rather than focus and blur, because focus and blur do not bubble. Also, live() also now accepts a data object, just as bind() has:

    $("p").live("myCustomEvent", function(e, myName, myValue){
    $(this).text("Hi there!");
    $("span").stop().css("opacity", 1) .text("myName = " + myName) .fadeIn(30).fadeOut(1000);
     });
    $("button").click(function () {
    $("p").trigger("myCustomEvent");
    });
  • before, after, replaceWith on disconnected nodes:
    You can now use before, after, and replaceWith on nodes that are not attached to the DOM. This allows you to do more complex manipulations before inserting the final structure into the DOM.

    jQuery(" ").before("Hello").appendTo("body")
  • .offset( coords | Function )
    It is now possible to set the offset of an element. Offset, like all setter methods, can now also accept a function as a second argument.

    $(MyEl).offset({ top: 10, left: 30 });
  • New .delay() method:
    The .delay() method will delay any further elements in the queue for the specified number of milliseconds.

    $("div").fadeIn().delay(4000).fadeOut();

And many other features are waiting to be used for our great new projects!

I think that this release of jQuery is a great step forward for web based applications development and their usability, as well as key tool for stimulating creativity in the web world.

Here are some graphs that show the dramatic overhauls in performance:

DOM manipulation

DOM Insertion

Performance of .html()

Performance of .html()

Performance of .remove() and .empty()

Performance of .remove() and .empty()

Don’t be afraid to update to 1.4! Backwards-Incompatible is really minimized:

  • .add() no longer plainly concatenates the results together, the results are merged and then sorted in document order.
  • .clone(true) now copies events AND data instead of just events.
  • jQuery.data(elem) no longer returns an id, it returns the element’s object cache instead.
  • jQuery() (with no arguments) no longer converts to jQuery(document).
  • .val(“…”) on an option or a checkbox is no longer ambiguous (it will always select by value now, not by text value).
  • jQuery.browser.version now returns engine version.
  • jQuery is now strict about incoming JSON and throw an exception if we get malformed JSON. If you need to be able to evaluate malformed JSON that is valid JavaScript, you can make a text request and use eval() to evaluate the contents.
  • Param serialization now happens in the PHP/Rails style by default. You can use jQuery.ajaxSettings.traditional = true; to use traditional parameter serialization. You can also set the behavior on a per-request basis by passing traditional: true to the jQuery.ajax method.
  • jQuery.extend(true, …) No longer extends non-plain-objects or arrays.
  • If an Ajax request is made without specifying a dataType and it is returned as text/javascript, it will be executed. Previously, an explicit dataType was required.
  • Setting an Ajax request’s ifModified now takes ETags into consideration.

Written by Matteo Bicocchi

15/01/2010 at 11:02 pm

jQuery.mb.scrollable 1.5.7

with one comment

The new 1.5.7 release is out.

Added goToPage method.

$(myScrollable).goToPage(pageNumber, noAnimation);

params:

pageNumber: (int) the number of the page you want to get;
noAnimation: (boolean) if the transition should be animated or not.

get it now!

Written by Matteo Bicocchi

12/01/2010 at 9:42 pm

A new charting tool for Patapage

without comments

We have published a new charting tool for Patapage.

based on jqPlot for jquery, it let you easily show any data as chart on your page with many configuration and a friendly tool to insert your value; it has a history manager to let you restore previous versions and it’s on the Patapage philosophy! check this article written by Roberto Bicchierai (the author of this tool): http://roberto.open-lab.com/2009/12/21/javascript-charting-tools-an-overview/

Go and try it!

Written by Matteo Bicocchi

22/12/2009 at 9:22 am

Published the RSS reader widget for Patapage!

without comments

Patapage RSS reader

Another great functionality for Patapage: an on line RSS reader that slide over your web page!
Go and try it!

Written by Matteo Bicocchi

16/12/2009 at 6:27 pm

jquery.mb.scrollable updated to version 1.5.5

with one comment

I’ve updated the jquery.mb.scrollable to version 1.5.5 fixing some bugs and adding two callbacks functions: nextCallback and prevCallback.

get the latest version!

Written by Matteo Bicocchi

14/12/2009 at 8:56 pm

jQuery.mb.flipText 1.0 is Out!

without comments

jquery.mb.flipText is a simple plug-in to turn your text vertically in both direction: top-bottom or bottom-top.Wasn’t that something you would have done on your HTML pages?

Take a look

See it also presented in Patapage: Flip your HTML text around.

Written by Matteo Bicocchi

04/12/2009 at 11:16 pm

Patapage beta is finally OUT!

without comments

I’m glad to announce the public beta release of Patapage, a new way of thinking the web!

Try it, enjoy it!

http://patapage.com

Written by Matteo Bicocchi

01/12/2009 at 7:17 pm