jquery mobile grid 收藏 0

UI组件Kendo UI for jQuery R3 2022亮点——拥有全新的按钮组件

Kendo UI for jQuery提供了在短时间内构建现代Web应用程序所需的一切，从众多UI子控件中选择，并将它们组合起来，创建酷炫响应式的应用程序，同时能最大限度的加快开发时间。

现代jQuery UI组件Kendo UI for jQuery R3 2022已于日前正式发布，新版本包含 jQuery SplitButton、DropDownButton、jQuery Signature等一系列新组件，欢迎下载产品最新版体验！

复制下面链接获取Kendo UI for jQuery R3 2022(PC端)：

www.evget.com/product/3968/download

从Kendo UI for jQuery组件的R3 2022版本开始，官方通过添加新的SplitButton组件扩展了可用的按钮类型的总数， jQuery SplitButton结合了按钮和下拉菜单的功能，使用户可以与主按钮元素交互来执行一个操作，或者从可用下拉菜单中的其他操作列表中进行选择。

虽然这种样式的组件已经在 jQuery Toolbar中使用了一段时间了，但是从R3 2022版本开始，开发人员可以以独立的方式利用该组件。扩展按钮类型的数量，Kendo UI for jQuery提供开箱即用，与此更新新的SplitButton组件正式可用。

另一种类型的按钮是添加到R3 2022中全新的Kendo UI for jQuery组件，jQuery DropDownButton的主要功能是显示一个带有操作列表的下拉列表，每当单击主按钮或以某种方式与之交互时，用户可以从中选择操作。

在新版本，还发布了另一个jQuery UI组件——Kendo UI for jQuery Signature（签名）组件，这个全新的组件允许最终用户使用他们的鼠标或某种触摸界面来记录他们的签名，然后开发人员可以根据需要保存和重用签名，并且可以轻松地将jQuery signature组件导出到图像。

许多Kendo UI for jQuery开发人员可能都熟悉Kendo UI Dojo，任何可用的示例都可以编辑，只要单击这些链接，就会打开Kendo UI Dojo工具。

Kendo UI Dojo是针对Kendo UI for jQuery的完美平台，它允许开发人员在不向任何本地项目添加代码的情况下试验Kendo UI组件，每个项目都创建了一个独特的URL供人们共享。

在R3 2022更新之前，当创建新项目时，Kendo UI Dojo将默认使用基于lesson的主题。在R3 2022中，Kendo UI Dojo现在与Kendo UI的其余部分一致，使用更新的基于Sass的主题作为默认。

在今年的早期版本更新中，Kendo UI for jQuery官方技术团队发布了新的jQuery PivotGrid组件，这个名为PivotGridV2的新组件是对PivotGrid组件的彻底革新，这次改进的目标是创建一个更现代的jQuery PivotGrid组件，具有更好的用户体验和设计、整体性能也得到了改进。

目前开发人员有两个数据透视网格可用，因为 jQuery PivotGrid v2 是从头开始构建的（数据透视网格非常复杂），所以当我们在新的 jQuery PivotGrid v2中构建功能时，Kendo UI for jQuery技术团队想要提供两个版本的数据透视网格。

在这个版本中，Kendo UI for jQuery PivotGrid v2组件正式添加了对本地数据绑定的支持。

添加了本地数据绑定后，开发人员现在可以选择将数据绑定到PivotGrid的最佳方式：位于某个服务器上的数据(使用OLAP远程)，或通过JavaScript数组或客户端上可用的数据集合(本地)。

15款响应式布局必备的jQuery Grid网格插件

Freewall

Freewall是一款跨平台的、响应式jQuery插件，可帮助你创建多种类型的网格布局：灵活布局、图像布局、嵌套网格、流体网格、Metro风格布局以用CSS3实现的动画效果和回调事件的瀑布流布局。Freewall是一套功能全面的解决方案，可创建动态的桌面网格布局、移动和平板电脑布局。

S Gallery

S Gallery是一个jQuery图片库插件，用于显示响应式网格中的图片。S Gallery的设计灵感来自于Sony的产品画廊，并模仿了其功能。

Mason.js

有许多javascript方案都可用于创建动态网格布局。尽管大多数都很好，但是有些网格有缝隙或者锯齿边缘。Mason.js是一款jQuery插件，巧妙地填补了缝隙，Grid网格显得非常完美。

jQuery.Shapeshift

用于创建类似于Pinterest动态网格布局的jQuery插件非常多。jQuery.Shapeshift就是其中一个强有力的代表。通过一个触摸动作，这些图片可以拖曳（需要使用jQuery UI）。拖曳可以影响网格布局，就像网格在需要的时候，会自动去填充空隙一样。这同样在触摸设备和响应式布局上有效。

jQuery Nested

Nested是一个用于创建多列网格布局的jQuery插件。该插件为所有元素创建一个矩阵，建立一个多列网格，并试图通过重新排序元素，以填补任何空白。虽然也有很多其他的方法可以达到类似的效果，但是Nested应用了一个小的动作：调整网格底部的任意元素以保证布局无缝隙。

Wookmark jQuery Plugin

动态列网格布局如此受欢迎，不仅是因为Pinterest使用它进行图片分享，而是因为它是显示不同大小的内容的最好方式。

Grid-A-Licious

Grid-A-Licious是一款能轻松创建类似Pinterest的浮动网格布局的jQuery插件。虽然，也有其他插件可以实现类似功能，但是Grid-A-Licious提供了一个更完美的响应式解决方案。无论在何种屏幕大小或设备上，Grid-A-Licious的表格表现皆完美。

jPhotoGrid

jPhotoGrid可将图像或字幕列表转换为可以浏览和放大照片的网格。这个插件几乎所有的样式都是靠CSS完成的。诀窍就是通过浮动列表项来对表格进行布局。jPhotoGrid所需要做的第一件事就是将列表转换成绝对定位。这就是为何该插件可以放大单个图像，然后将其返回到原来的地方。

Gridster

Gridster是一款令人印象深刻的jQuery插件，可用于开发类似于iGoogle的多列网格，可以拖动n行删除并重新排序。该插件仅需 jQuery （无需 jQuery UI）并且可以将任何给定的HTML结果转换成网格部件。

Photoset Grid

Photoset Grid 是一款简单的 jQuery 插件,可以用于把图片排布成一个灵活的网格。最初,这款插件是为 Tumblr 主题创建的，用于实现响应式的图片网格布局。

Flex

Flex是一款流式非对称的网格动画jQuery插件。你可以将鼠标悬停在瓦片上，就能看到它们渐渐扩大。

Freetile

Freetile是一个jQuery插件,用于组织网页内容成一个高效的、动态的响应的布局。它可以应用到一个容器元素，它会尝试安排它的子元素，最佳利用屏幕的空间，通过“包装”他们形成紧凑的布局。

Griddy

Griddy是一款小巧、灵活的JQuery插件，能够在任何元素之上创建简单的，自定义的网格布局。Griddy还可以根据行/列间隔空间的数量自动计算行高、列宽。设置的选项包括：行，行高，列高，列宽，颜色和透明度等。

jSquares

jSquares是一个用来弹出悬停图像和说明的jQuery插件。它基本上和在www.ted.com上找到的图像表格相同。调用jSquares时，可以加入一些参数，如字幕大小，图像的透明度，切换速度等。它就在IE6+，FF3+，Safari 3以及Opera10上工作起来很有魅力。

jqGrid

jqGrid是一款AjaxedJQuery网格插件，由于网格是一个使用Ajax回调函数加载数据的客户端解决方案，它可以用于任何服务器端语言，如ASP，PHP，ASP.NET，JSP等。它有一个聪明的特性——子网格，可以在调用主列的时候显示一个子网格。

10个最有趣的jQuery Grid插件

6. jQuery Portfolio

如果你想设计一个时尚组合的网站jQuery Portfolio 插件是一个不错的选择。

你可以在网格中设置列的数目以及想要的jQuery过渡效果。 jQuery Portfolio插件在移动设备的响应效果也很好，所以不用担心在移动设备上的用户体验。

7. jQuery MatchHeight

jQuery MatchHeight插件允许你用一种特殊的jQuery网格使得所有选中元素的高度完全相等。 MatchHeight自动匹配在同一组中的元素高度，并灵活处理浮点元素和包装。你可以使用这个插件来漂亮的放置项目。

你可以使用一个最大高度作为基准，或定义一个特定的目标元素，然后MatchHeight将会确保其它元素不会比这更大。它有一个Data API使你可以使用HTML5文件里内联标记中的数据属性。

8. Photoset Grid

如果你喜欢tumblr的Photoset功能，那Photoset Grid jQuery插件就是专门为你设计的。这个方便的前端工具就是基于Photoset功能将图像转换成灵活的网格。这个插件的原始版本是用于创建Tumblr主题，后来开发团队决定给设计人员机会让他们在该插件中自己设计。

如果你想在你自己的Tumblr主题添加Photoset Grid，你可以在自定义代码段嵌入自己的代码。大概这个插件最酷的功能可能就是在图像网格中加入了Lightbox。你可以在这里点击其中一张图片感受一下。

9. Shuffle

你是否曾经想要一个灵活的图像网格，你可以进行分类、排序和筛选项目？如果是的话，你一定要试试Shuffle。这个插件做出来的网格非常漂亮，特别是因为它在页面加载时加了一个很酷的洗牌效果。

项目可以被添加到多个组，然后用户可以通过组来过滤它们，因此这是一个很好的用户体验。该插件给列出的项目所属类别图像增加了微妙的文字说明。你可以在JavaScript变量的帮助文档下设置很多选项，如洗牌效果的速度、装订线的宽度、列的宽度等。

10. jQuery Gridly

jQuery Gridly 是实现触摸设备上网格布局的不二选择。这个插件允许用户在屏幕上拖拽项目。无论是托还是拽，调整大小的功能都会根据触屏手势进行反应。

用户可以关闭他们不喜欢的图像，在图像关闭之后页面会通过很酷的效果重新排列布局。而且jQuery Gridly很容易在Rails 应用上与Ruby集成使用。

本站文章除注明转载外，均为本站原创或翻译

本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com