星期二 早上大雨渐止转阴 17～26℃

jquery 瀑布流插件 Wookmark

https://github.com/GBKS/Wookmark-jQuery

需要 jQuery 1.4.3 或以上版本。

今晚在使用的时候，发现这个插件不能单独设置纵向间距，修改一下插件：

把

item.css({
 position: ‘absolute’,
 top: shortest+’px’,
 left: (shortestIndex*columnWidth + offset)+’px’
});

改为（增加底边框）

item.css({
 position: ‘absolute’,
 top: shortest+’px’,
 left: (shortestIndex*columnWidth + offset)+’px’,
 "border-bottom": "16px solid #fff" // 增加底边框，颜色和网页背景色相同，从而控制纵向间距
});

附：这个方法不够灵活，只是应付一下需求。

使用 jquery 的 map() 方法将一组元素转换成数组

例：

<tr>
 <td><input type="checkbox" value="1" /></td>
 <td>001</td>
 <td>13711111111</td>
</tr>
<tr>
 <td><input type="checkbox" value="2" /></td>
 <td>002</td>
 <td>13722222222</td>
</tr>

想要获取选中的 checkbox 的 value 及其所在 <tr> 的某个位置的字符，希望返回的格式：

var data = [
 {
  id : [value],
  num : [str]
 }，
 {
  id : [value],
  num : [str]
 }
]

传统 push() 方法：

var data = [];
$("#list :checkbox:checked").each(function (){
 data.push(
  {
   id : $(this).val(),
   num : $(this).parent().next().text()
  }
 )
});

jquery 的 map() 方法：

var data = $("#list :checkbox:checked").map(function (){
 return {
  id : $(this).val(),
  num : $(this).parent().next().text()
 }
}).get();

参考：http://stackoverflow.com/questions/2099164/jquery-array-of-all-selected-checkboxes-by-class

友吧今天

处理装备瀑布流布局。

上次说考虑到时间关系，暂时不做瀑布流，不过今天发现一个挺不错的瀑布流插件，于是晚上处理了一下，效果挺好。