跳到主要内容

22个出色的jQuery插件

+$There have been tens of thousands of jQuery plugins written for the jQuery library. Created in 2006 by John Resig, the jQuery library is now the most popular JavaScript library on the web. It's a fantastic resource for designing and developing user interactions quickly. Whether it's an image gallery or form, content-revealing CSS animation or an explosion effect, the library provides the core building blocks to allow you rapid prototyping and to deliver a unique user interface with minimum code and effort.

+$However, just because you can create your own solution to any given problem, does that mean you should? Of course not! There's absolutely no need to reinvent the wheel every time you want to create a bit of common functionality; use plugins to instantly add a behaviour. Doing so will save you even more time and effort! Here's our list of useful jQuery plugins.

+$For more useful web design resources, explore our list of the+$best JavaScript APIs+$and our pick of the+$best JavaScript Frameworks+$to Consider.

+$01. RTO+P Video Player

jQuery plugins: RTO+P Video Player

+$Make your own video player rather than rely on YouTube embeds+$(Image credit: RTO+P)

+$Sure, it's easy to embed video from YouTube or wherever, but if you want a little more control over your video then RTO+P Video Player is a must. It makes it easy to build and customise your own video player that gets its video either from your own server or CDN, or from a public Vimeo stream. Use the HTML5 video tag to make life easy, or for better performance you can use the lazy load option.

+$02. Slick

jQuery plugins: Slick

+$Whatever carousel you need, make it with Slick+$(Image credit: Ken Wheeler)

+$Is this the last carousel you'll ever need? It certainly could be; Slick's a jQuery plugin that gives you fully responsive carousels of just about every kind you could wish for, with all sorts of options to play with including lazy loading, autoplay, callbacks and more.

+$03. Muuri

jQuery plugins: Muuri

Muuri灵活的布局具有响应性,可排序性,可过滤性和可拖动性

对于最灵活的布局,NiklasRämö的Muuri非常值得一看。它的布局系统使您能够以任何可想象的方式在容器内定位各种尺寸的网格项,并且它具有响应性,可排序性,可过滤性和可拖动性。默认情况下,它会以“先适合”的方式排列所有内容,但您可以为不同的布局样式添加自己的布局算法。

+$04. AnchorScroll.js

jQuery plugins: AnchorScroll.js

使用AnchorScroll.js为您的网站提供一些运动模糊

没有什么比一些超平滑滚动可以帮助您的网站脱颖而出,而AnchorScroll是一个轻量级且易于使用的jQuery插件。它为您提供平滑滚动以锚定目标,添加类和回滚滚动事件上的元素,最重要的是可以选择在滚动时为身体添加模糊效果,以及带来的弹跳效果滚动到锚元素后回到你来自的地方。

+$05. Timeline.js

timeline.js

时间轴完全按照它在锡上的说明,并创建一个时间轴滑块

这个jQuery插件提供了旋转木马组件的一个转折:Timeline.js为您提供创建旋转木马时间轴所需的一切(即根据时间顺序点进展的滑块)。它包括大量的视觉和功能定制选项。

+$06. Tilted Page Scroll

tilted page scroll

倾斜页面滚动为您的页面添加了整洁的3D效果

来自Pete R.的这个插件是吸引人们注意力并为您的网站增加一点额外深度的绝佳方式。安装后,项目会在向上滚动页面时倾斜进入视图,并在页面顶部滚动时再次倾斜。它外观漂亮,易于实现。

+$07. Focuspoint

focuspoint jquery plugin

告别严重裁剪的响应图像

响应式网页设计的好处是能够创建一个在任何设备上看起来都很好的单个页面。但是,如果您的网站自动裁剪图像以适合某些视口,则通常会失去焦点。使用Focuspoint,您可以通过为每个图像指定焦点来确保您的图像在任何容器中看起来都很棒,并且插件将在重要位之前裁剪掉不需要的部分。

08. SVGMagic

SVGMagic jquery plugin

SVGMagic创建PNG以替换不受支持的SVG

使用SVG图像是一个好主意,因为它们在任何大小上看起来都很清晰,而且这个插件可以帮助您做到这一点,而不必担心不支持它们的浏览器。如果不支持SVG,它会搜索SVG图像并将其替换为PNG版本。

+$09. Face Detection

Face Detection jQuery plugin

这个插件提供了一种使用一些强大技术的简单方法

使用此插件检测并获取图像,视频和画布中人脸的坐标,该插件由Jay Salvat编写并使用刘刘的人脸检测算法。

+$10. Round Slider

rounderslider jQuery plugin

滑块可以根据您的目的主题

此圆形滑块使用户可以通过鼠标悬停在圆上来选择一系列值。完整滑块是默认设置,但您也可以使用它来获得四分之一圆,半圆和饼形。您可以调整CSS样式以各种方式对其进行主题化,例如,看起来像速度计。没有涉及图像;它全都是用CSS和JavaScript制作的。

+$11. JInvertScroll

jinvertscroll jQuery plugin

轻松获得视差效果

JInvertscroll可以轻松实现具有视差效果的水平滚动。将你的演示网站上的滚轮滚到侧面,同时两层景观以不同的速度移动,以创造一种深度的幻觉。

+$12. Slinky

jQuery plugins: Slinky

菜单设计不会过时?

Slinky是一款优雅,永恒的菜单设计,适用于您拥有大量子菜单的任何场景。选择一个项目,动画将子菜单滑过。有一个演示这里

下一篇:更重要的jQuery插件



翻译字数超限