文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

【第3期】前端常用插件、工具类库汇总

一个效果非常好的弹层，支持图片、支持输入 轮播图 Swiper：https://www.swiper.com.cn/ 开源、免费、强大的触摸滑动插件，常用于移动端。...iSlider：http://eux.baidu.com/iSlider/demo/index_chinese.html# iSlider是一个表现出众，无任何插件依赖的手机平台javascript滑动组件.../slick/ jQuery旋转木马插件slick jQuery slider：http://www.jq22.com/jquery-info889 插件描述：最全最简单最通用的 幻灯片轮播 ，可控制的插件...move.js：http://visionmedia.github.io/move.js/ 一个小型的JavaScript库，通过JS来控制一系列的CSS动画顺序执行，使CSS3动画变得非常简单和优雅。...支持 MP4、M3U8、FLV 等多种媒体格式，同时它也帮我们解决了大部分的兼容性、差异化问题，包括全屏、自动播放、内联播放、直播解码等常见媒体播放需求。

5.2K10
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    快速完成网页设计,10个顶尖响应式HTML5网页模板助你一臂之力

    总的来说， CSS3语言使您的网站美丽而时尚。 3. Bootstrap已经成为用户界面开发人员最喜欢的前端框架之一，其优势在于其开源的可用性。...最重要的是，它提供了最新的JavaScript插件，使模板更加高效和强大。 你要知道，一个具有启发性的令人惊叹的免费HTML5网页模板可以大大减少耗时并提高生产力。 2. ...在这个免费HTML5启动画面模板的演示中，你可以看到带有美丽背景滑动图像的页面。 3. Beverages - 餐厅类Bootstrap响应式网页模板 ?...主页上有一个带有标题文字的猫头鹰旋转木马滑块。此外，有jQuery UI日历的旅行预订表格。在主页有旅游套餐，最热门的目的地和关于您的公司的部分，让网站访问者和专业外观的网站印象深刻。 5. ...开发技术：HTML 5, CSS 3, Bootstrap 3, JS, jQuery 网页特色： l 粘滞菜单栏 l 滑动标题背景 l 幽灵按钮 l HTML5 / CSS3 如果你想要轻量级，灵活且易于定制

    11.8K51

    快速完成网页设计,10个顶尖响应式HTML5网页模板助你一臂之力

    总的来说， CSS3语言使您的网站美丽而时尚。 3. Bootstrap已经成为用户界面开发人员最喜欢的前端框架之一，其优势在于其开源的可用性。...最重要的是，它提供了最新的JavaScript插件，使模板更加高效和强大。 你要知道，一个具有启发性的令人惊叹的免费HTML5网页模板可以大大减少耗时并提高生产力。 2. ...在这个免费HTML5启动画面模板的演示中，你可以看到带有美丽背景滑动图像的页面。 3. ...主页上有一个带有标题文字的猫头鹰旋转木马滑块。此外，有jQuery UI日历的旅行预订表格。在主页有旅游套餐，最热门的目的地和关于您的公司的部分，让网站访问者和专业外观的网站印象深刻。 5. ...Asentus - 免费的响应式引导页HTML5模板 开发技术：HTML 5, CSS 3, Bootstrap 3, JS, jQuery 网页特色： l 粘滞菜单栏 l 滑动标题背景 l 幽灵按钮

    14.2K120

    「首席架构师推荐」一系列很棒的的浏览器端JavaScript库资源

    volo - 从模板创建前端项目，添加依赖项并自动生成项目。 Duo - 下一代软件包管理器，融合了Component，Browserify和Go的最佳创意，使组织和编写前端代码快速而轻松。...slick - 您需要的最后一个旋转木马。...Embla Carousel - 用于Web的可扩展低级旋转木马，用TypeScript编写。 范围滑块 Ion.RangeSlider - 功能强大且易于定制的范围滑块，具有多种选项和皮肤支持。...滑动和滑动 - 可与touchSwipe库配合使用的滑动滑动菜单。 表/网格 jTable - 一个用于创建基于AJAX的CRUD表的jQuery插件。...novacancy.js - 文本Neon Golden效果jQuery插件。 jquery-responsive-text - 使文本大小响应！

    9.1K21

    17 Most popular Vue.js plugins

    Vue 被一个健康的插件和包的生态系统所加强，使开发变得可靠、快速和简单。由于Vue 是一个国际开发者社区所选择的框架，所以有一个不断增长的插件和包库，你可以在项目中使用。...metaInfo 的数据都是响应的，如果数据变化，头部信息会自动更新 支持 SSR。...主要特征： 支持触控设备 支持拖动手柄和可选文本 智能自动滚动 支持不同列表之间的拖放 没有 jQuery 依赖 保持同步 HTML 和查看模型列表 兼容 Vue.js 2.0 转换组 Vee-Validate...Swiper.js 地址：https://swiperjs.com/vue Swiper.js 是一个预制的旋转木马组件，可以用来在各种图片之间滑动。...它还通过自动处置几何体、材料、纹理、渲染器等来简化对象的处置，这在原始库中是不存在的。

    7.5K30

    CSS3的3D变换和动画

    一个demo 这个div会沿着Y轴旋转130deg div { transform: rotateY(130deg); } 一个H5上的应用场景 实现一个旋转木马的效果，这里列出核心代码，完整的后续放在...所有卡片给到一个旋转的角度 用模板实现是很方便的一件事情 style="transform: rotateY(deg) translateZ(px);...-webkit-transform: rotateY(deg) translateZ(px)" 默认情况下上面所有的卡片效果看起来是旋转了，但是都挤到一起去了...，上面的translateZ是让每个卡片向它们的正前方平移一个具体的，这样看来才会形成一个类似立体圆柱的效果，也就是旋转木马的效果了 要让它动起来，js也少不了，在每次滑动结束后触发每个卡片的旋转...firefox以及Opera支持@keyframe，而chrome和safari需要加浅醉-webkit-，IE9及早期IE版本是不支持的，所以这些功能一般是在移动端使用 一个demo 该demo的作用是使div

    1.7K11

    CSS3的3D变换和动画

    一个demo 这个div会沿着Y轴旋转130deg div { transform: rotateY(130deg); } 一个H5上的应用场景 实现一个旋转木马的效果，这里列出核心代码，完整的后续放在...所有卡片给到一个旋转的角度 用模板实现是很方便的一件事情 style="transform: rotateY(deg) translateZ(px);...-webkit-transform: rotateY(deg) translateZ(px)" 默认情况下上面所有的卡片效果看起来是旋转了，但是都挤到一起去了...，上面的translateZ是让每个卡片向它们的正前方平移一个具体的，这样看来才会形成一个类似立体圆柱的效果，也就是旋转木马的效果了 要让它动起来，js也少不了，在每次滑动结束后触发每个卡片的旋转...firefox以及Opera支持@keyframe，而chrome和safari需要加浅醉-webkit-，IE9及早期IE版本是不支持的，所以这些功能一般是在移动端使用 一个demo 该demo的作用是使div

    2K60

    Jump Start Bootstrap 第4章

    下拉插件的默认状态是关闭的；然而你刷新页面后它将切换状态并使菜单可见。...Carousel(旋转木马) 幻灯片非常流行，可以用于新闻、电子商务和视频共享网站。这种类型的功能被用来在网站上展示最受欢迎的项目，有组织的，有吸引力的幻灯片。...类slide是用来给carousel的每张幻灯片产生滑动效果的。它还应该有一个自定义属性data-ride，它告诉Bootstrap在页面加载时就可以启动滑动效果。...如果没有这个属性，在您第一次手动操作之前，幻灯片将不会自动更改。...接下来，我们构建旋转木马的心脏:幻灯片。首先，我们为所有的幻灯片创建一个包装器元素。这将是一个包含类carousel-inner的div。每个幻灯片由一个具有类”item”的元素定义。

    34.9K40

    Touch 移动设备上的 手势识别 与 Js事件库

    事件开关 pinch: true, //pinch类事件开关 } 百度touch.js可以说是Web移动端touch点击事件不错的解决方案，搭配zepto.js或者jQuery...rotateleft 向左旋转 ~ rotateright 向右旋转 ~ rotate 旋 转 滑动 swipestart 滑动手势起点 ~ swiping 滑动中 ~ swipeend 滑动手势终点...~ swipeleft 向左滑动 ~ swiperight 向右滑动 ~ swipeup 向上滑动 ~ swipedown 向下滑动 ~ swipe 滑动 拖动开始 dragstart 拖动屏幕 拖动...swipe类两点之间的位移 distanceX, x 手势事件x方向的位移值, 向左移动时为负数 distanceY, y 手势事件y方向的位移值, 向上移动时为负数 angle rotate事件触发时旋转的角度...duration touchstart 与 touchend之间的时间戳 factor swipe事件加速度因子 startRotate 启动单指旋转方法，在某个元素的touchstart触发时调用

    5.3K40

    由旋转画廊，看自定义RecyclerView.LayoutManager

    一、简介 前段时间需要一个旋转木马效果用于展示图片，于是第一时间在github上找了一圈，找了一个还不错的控件，但是使用起来有点麻烦，始终觉得很不爽，所以寻思着自己做一个轮子。...想起旋转画廊的效果不是和横向滚动列表非常相似吗？那么是否可以利用RecycleView实现呢？...那么我们也可以通过自定义LayoutManager来实现旋转画廊的效果。 看下要实现的效果： ?...第二个方法：在layoutItem()中 调用了父类方法layoutDecorated对Item进行布局，其中mOffsetAll为整个旋转控件的滑动偏移量。...总结 以上，通过旋转画廊控件，我们过了一遍自定义LayoutManager的流程。

    3.4K51

    Unity基础教程-物体运动（十一）——滚动（Animated Sphere）

    （平滑的之字形） 2 滚动的球 我们的球体通过在表面上滑动，跳跃，游泳和跌落而运动。只要球体具有统一的颜色，它在任何方向上看起来都是相同的，因此我们将无法看到它是滚动还是滑动。...（预制体，引用自身的ball） 我们有一个纹理球，这很明显它只会滑动。 ? （滑动球） 让我们将与更新球相关的所有代码放在单独的UpdateBall方法中。将材质设置代码移到此处。...2.3 运动 为了使球滚动，我们必须旋转它，使它的表面运动与它的运动相匹配。最简单的完美情况是一个球在一条直线上滚动。在每个时刻，球表面只有一个点接触地面。...可以自动调整其对齐的速度，就像轨道摄像机的对齐速度一样，因此可以添加一个选项。 ? ?...3.1 陡坡 当我们使用最后一个接触法线导出旋转轴时，球在空中滚动时就像在平坦的地面上一样。即使球沿墙壁滑动，也会发生这种情况。 ?

    4.1K30

    从零开始学 Web 之 移动Web（五）touch事件的缺陷，移动端常用插件

    FastClick.attach(document.body); }, false); } jQuery 或 Zepto 的话： $(function() { FastClick.attach...在你的项目中包含仅仅4kb大小的iScroll，你的项目便拥有了滚动，缩放，平移，无限滚动，视差滚动，旋转功能。给它一个扫帚它甚至能帮你打扫办公室。...var wrapper = document.getElementById('wrapper'); var myScroll = new IScroll(wrapper); 如果是 jQuery 的话更简单了...2、swipe swipe.js 是一个比较有名的触摸滑动插件，它能够处理内容滑动，支持自定义选项，你可以让它自动滚动，控制滚动间隔，返回回调函数等。经常作为轮播图使用。...临时Tips：overflow:hidden 可以让子元素浮动的父盒子由高度为0，到自动伸缩。

    3.6K20

    一篇文章带你用jquery mobile设计颜色拾取器

    2、在你的网页中添加 jQuery Mobile 你可以通过以下几种方式将jQuery Mobile添加到你的网页中： 从 CDN 中加载 jQuery Mobile (推荐)。...javascript" src="jquery.mobile/jquery.mobile-1.4.5.js"> 【三、项目目标】 1、滑动滑块将对应的颜色显示在页面。...3、滑动任意一条滑动条。得到想要的颜色。 ? 4、手动输入RGB（0-255）值，得到相对应的颜色，如下图所示。 ?...【六、总结】 1、使更多的人去了解jQuery Mobile， jQuery可以快速找到文档中的html元素，并对其进行操作，如隐藏、显示、改变样式...”。...2、本项目主要学习了input标签（类型：滑动条）如何与js绑定，获取事件响应。 3、颜色拾取器项目中，随机产生颜色这个难点进行了有效的分析，并提供解决方案。 4、按照操作步骤，自己尝试去做。

    2K20

    2020年你应该关注这50款前端热门工具，JavaScript插件篇（一）

    1、autoComplete.js 官网地址：https://tarekraafat.github.io/autoComplete.js/ 一款原生零依赖轻巧的自动建议 JavaScript 插件，目前...此插件主要有以下特点： 方便你集成到 Angular, React, Vue 和 Vanilla 项目中 灵活的设置参数和方法，定制个性化的软键盘 基于弹性盒子布局，易于集成和设计 支持外挂个性化插件，比如自动更正...手机端键盘(安卓、IOS) 支持背景暗黑样式 支持数字键盘 国际化支持，比如法文、日文、俄语等 4、fslightbox.js 官网地址：https://fslightbox.com/ 一款原生无需jQuery...该插件性能出色及其易用的API，可以很容易使目标HTML元素实现视差效果，并且使用链式语法轻松实现回调（when方法），核心方法包含：start/stop, speed 等。...https://daybrush.com/moveable/ Moveable 是一款原生零依赖的 javaScript 插件，使用这款插件，可以让指定的 HTML 元素 随意拖拽 、调整大小、缩放、旋转

    2.9K30
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券