JQuery Wookmark-2 jQuery dynamic table plug-in effect display

I have previously written an article on Wookmark in my blog, which can only be a simple introduction. As for its internal usage and effect display, I have not specifically written it out, today I will briefly present some of the methods and effects in this blog introduction, if you want to briefly look at the previous introduction of Wookmark, you can visit: http://blog.csdn.net/sunyingyuan/article/details/17613627

Introduction

Wookmark is a very practical jQuery plug-in to Display Dynamic table elements.

You can go to http://www.wookmark.com/jquery-plugin?.

If you like this project, you can also donate to it: donate <喎?http: www.bkjia.com kf ware vc " target="_blank" class="keylink"> Examples/ydLUsbtqUXVlcnnS1LK7zay1xLe9yr2199PDPC9wPgo8cD6/examples + JCg = ". myElements '). wookmark ();

Here, myElements is the table you made and wants to make it a class style displayed by dynamic table elements such as wookmark.

Configuration item

$('.myElements').wookmark({  align: 'center',  autoResize: false,  comparator: null,  container: $('body'),  direction: undefined,  ignoreInactiveItems: true,  itemWidth: 0,  fillEmptySpace: false,  flexibleWidth: 0,  offset: 2,  onLayoutChanged: undefined,  outerOffset: 0,  resizeDelay: 50,  possibleFilters: []});

The parameters mentioned in the above configuration items are also mentioned in our previous blog, you can see over there: http://blog.csdn.net/sunyingyuan/article/details/17613627

ItemWidth and flexibleWidth

The values of these two fields can be set to the numeric type (which is treated as the pixel value), and can also be set to the percentage. When flexibleWidth is set to itemWidth! = 0 is the minimum width used as the column (I am not familiar with English in this place, so I will try again later ).

Update trigger

The element is hidden and invisible until it is set to the visible state. If you set it to the wookmark attribute on a hidden tab, the effect will not be immediately obtained, you can also manually trigger the trigger to make your wookmark visible.

$('#myContent').trigger('refreshWookmark');

FillEmptySpace

Sometimes to create an appropriate layout, for example, creating a placeholder at the bottom. You can view the specific usage of example-placeholder in the official example. The placeholder class must be wookmark-placeholder. Of course, you can also overwrite the class style to meet your personalized needs.

IgnoreInactiveItems

When you set ignoreInactiveItems to false, items that are not active will still be displayed. This method can be used to fade out the filtering method of items. You can view this example.

Comparator

You can use this option to provide a common comparison function as a sort method. You can view example-sort or example-stamp to see how to use it.

So, for the time being, let's write it here first. Similarly, I will share some of my usage experiences with you in the comments just like the previous blogs, this is mainly to let everyone know that there is such a thing in the jQuery plug-in. When you do the website, you can see whether it can be used and avoid repeated efforts.