资讯月刊下载
[移动开发] 15 个有意思的 JavaScript 和 CSS 库
Tutorialzine 旨在让你了解最新最酷的 Web 发展趋势。这就是我们每个月为何都会发布一些我们偶然发现并认为值得你关注的优秀资源的原因。 BasicScroll 该库使你可以在你的设计中添加 parallax 滚动动画效果。你可以直接在你的 CSS 中使用变量和属性,或者使用 JS 来获得更好的动画效果。它运行非常流畅,独立于框架,在桌面和移动设备上非常出色,并且支持触屏输入。 P ...
[Web前端] 开源巨献:年度最佳 JavaScript 和 CSS 开源库推荐!
Tutorialzine 每个月都会公布一次当月新增的 JS 和 CSS 库。2018 新年之际,该网站整理出了 2017 年最受用户欢迎和喜爱的一些 JS 和 CSS 库,供大家学习和参考。 JavaScript 本地存储库 localForage localForage 是一个 JavaScript 库,提升了应用程序的离线体验,通过使用异步的数据存储,提供简单的类似 localStora ...
[Web前端] 12个经典大气的HTML5/CSS3应用动画
昨天为大家收集了15个华丽的HTML5动画应用,有几个应用还比较实用。今天我们就接着来分享第二波干货,也是基于HTML5和CSS3的动画应用,将涉及到HTML5表单、HTML5图片特效以及HTML5图表等应用领域,希望大家会喜欢。 1、HTML5/CSS3自定义下拉框 3D卡片折叠动画 之前我们分享过一款CSS3带小图标下拉菜单,它更多的是一款菜单,但是今天要分享的一款CSS3自定义下拉框取代了传 ...
[Web前端] 国内最火的 HTML、CSS、JavaScript 开源项目 Top ...
对于开发者而言,想要着手前端开发,HTML、CSS 和 JavaScript 是三项必备的基础技能。而如何事半功倍地掌握好这些知识?通过了解当下火热的开源项目不乏为最佳学习姿势。本文盘点国内评分最高且收藏量超过 100 的前端技术开源项目,希望可以帮助更多的开发者扩展学习。 1.极简模块化前端UI框架 Layui 评分:9.3;收藏量:873 授权协议:MIT 开发语言:JavaScript、 ...
[移动开发] 你所不知道的 CSS 动画技巧与细节
怕标题起的有点大,下述技巧如果你已经掌握了看看就好,欢迎斧正,本文希望通过介绍一些 CSS 不太常用的技巧,辅以一些实践,让读者可以更加深入的理解掌握 CSS 动画。 废话少说,直接进入正题,本文提到的动画不加特殊说明,皆指 CSS 动画。 正负旋转相消 嗯。名字起的很奇怪,好像数学概念一样。 在动画中,旋转是非常常用的属性, { transform: rotate(90deg); } 那旋 ...
[移动开发] 9个超实用jQuery/CSS3应用插件欣赏
jQuery是一款很强大的JavaScript框架,本文介绍的9个应用插件很多都是基于jQuery的,另外,CSS3的应用让这些插件增添了不少光彩,特别是第一个动画插件Animate.css非常实用,可以让你实现50多种不同的网页动画。 1、强大的CSS3动画库animate.css 50多种动画形式 今天要给大家介绍一款强大的CSS3动画库animate.css,animate.css定义了大 ...
[移动开发] 15 个有趣的 JS 和 CSS 库
炎热的 7 月已经过去,秋天的脚步更近了。在本月,Tutorialzine 依旧为大家带来了一些有趣、实用的前端库,看看有哪些适合你的项目呢? 1.Titanic 这是一组自带悬停动画的精致 SVG 图标。但与大多数 Web 图标不同之处在于 - 它的动画是基于 JS 的,需要你使用 bodymovin 库将动画效果导出为 SVG 格式。 项目地址:【传送门】 2.Rebass Reb ...
[Web前端] 15 个有趣的 JS 和 CSS 库
炎热的六月,也阻挡不住我们分享的脚步。在本月,Tutorialzine 又为大家带了哪些新鲜货呢?开发者们,一起来瞧瞧吧! 1. Moon Moon 是一个灵感源于 Vue.js 的 JavaScript UI 库,但它却更轻量、简单。它具备优化的虚拟 DOM 引擎,对用户友好的 API,并且在 gzip 压缩后仅有 6KB 的大小。 2. VX VX 结合了 D3 和 React 虚拟 D ...
[Web前端] 15 个有用的 JavaScript 和 CSS 库
高质量的网页设计需要直观和用户友好的界面,而且屏幕上的元素也起着非常重要的作用。Web 设计师不断地寻找优秀代码的集合,希望能提升工作效率。但找到合适的工具库并不总是那么容易的。网络上有太多的资源可以使用,而且也是免费的,因此很难判断哪些资源比较好。这就是精心搜索并编写这个最好的库列表的原因。 无论是希望创建一个视觉上吸引人和功能强大的布局,还是需要在表单和其他区域添加屏幕上的规则和验证,你都会喜 ...
[Web前端] 10大炫酷的HTML5文字动画特效欣赏
文字是网页中最基本的元素,在CSS2.0时代,我们只能在网页上展示静态的文字,只能改变他的大小和颜色,显得枯燥无味。随着HTML5的发展,现在网页中的文字样式变得越来越丰富了,甚至出现了文字动画,HTML5和CSS3的强大之处就在于此。本文分享的10款炫酷的HTML5文字动画特效非常不错,一起来看看吧。 1、HTML5 Canvas粒子效果文字动画特效 之前我们分享过很多超酷的文字特效,其中也有 ...
[Web前端] 15 个有趣的 JS 和 CSS 库
时光飞逝, 每月 Tutorialzine 都会为大家分享一些有趣的前端库。那么在本月,又准备了哪些优秀的 Web 开发资源呢?前端儿,一起来瞧瞧吧! 1. Buefy 这是一个基于 Bulma 的 Vue.js 轻量级 UI 组件,而 Bulma 则是基于 Flexbox 的 CSS 库。Buefy 具备典型的 Web 应用程序所必备的所有组件,例如 modals、toast 以及 notif ...
[Web前端] 2016 年 10 个最佳的 CodePen 作品
说到 CodePen,前端开发者们肯定不会陌生。如果说 Dribbble 是设计师们聚集的圣地,那么 CodePen 则是前端开发者们约“码”的天堂。它不仅提供给你了一个 Showcase 的平台,而且能够开拓你的视野 —— 你能够及时的了解最新前端技术的应用,同时帮助交互设计师找寻更多的灵感。 年终盘点向来是各大网站、社区的重头戏。当然,与往年一样 CodePen 也出了期名为《The Most ...
[Web前端] 支付宝AR抢红包?前端轻松就破解~
近期阿里搞了各LBS+AR实景的红包玩法,小伙伴们在公司里都玩疯了~ 有时候为了抢一个红包,会跑到另一个地方去拍照,虽然略麻烦,但整体的互动还是很有意思的。 不过对于机智的前端童鞋来说,只需要简单的一段代码就能破解AR红包(当然成功率也不是100%)。 破解原理见《上线仅一天:支付宝AR红包惨遭技术流破解》,感谢这位设计师童鞋。 我们要做的事情其实很简单 —— 把系统自带的小横条都去掉,去掉 ...
[Web前端] 致我们终将组件化的 Web
本文转自:AlloyTeam 这篇文章将从两年前的一次技术争论开始。争论的聚焦就是下图的两个目录分层结构。我说按模块划分好,他说你傻逼啊,当然是按资源划分。 ”按模块划分“目录结构,把当前模块下的所有逻辑和资源都放一起了,这对于多人独自开发和维护个人模块不是很好吗?当然了,那争论的结果是我乖乖地改回主流的”按资源划分“的目录结构。因为,没有做到JS模块化和资源模块化,仅仅物理位置上的模块划 ...
[Web前端] 18个你可能不相信是用CSS制作出来的东西
与流行的看法相反,CSS不仅仅是用来提供一个WEB页面的基本风格,以使它看起来更有吸引力。还有很多其他的事情,CSS也可以做的很好。由于它创建动画和交互的能力,CSS集合HTML以及JavaScript给WEB开发者提供了尝试不同方法的机会。 浏览器就像一个空的画布,WEB开发者可以在这里尽情的发挥。下面是18个人们用CSS创建的又酷又有创造性的东西的例子,从原始字符到有趣的动画,有很多激励你自己 ...
[Web前端] 分享十佳Web开发资源
Web开发对开发者来说是一个非常复杂的任务,本文所列举的网络资源指南涵盖了教程、在线教程、参考材料等等,最重要的是这些资源都来自网页设计权威专家的指导和建议,相信对你会有所帮助。 1. W3schools W3schools主要用于学习、测试和培训,其用例简单,以便提高阅读和对基础的了解。 2. Html 人们通常认为创建一个网站是困难的,不过事实并非如此。每个人都可以学习如何去做一个网站,在 ...
[Web前端] 你该学点HTML/CSS知识的9大理由
每个人都应该学写代码——这一观点简直就是铺天盖地地映入我们眼帘。或许你会莫名其妙,程序员学代码那是理所应当,但是作为一个作家、营销人员、财务工作者甚至是工人,为什么也需要学习代码呢? 好吧,下面我会告诉你为什么懂点HTML和CSS会让你的职业生涯发生巨大的改变。学习技术不仅仅是生产助理亦或是印刷设计师的事——无论你是小企业主、销售经理、事件协调员还是魔术师,都能让你受益于HTML和CSS知识。 ...
[Web前端] 从一行CSS调试代码中学到的JavaScript知识
现在到处都是JavaScript,每天都能知道点新东西。一旦你入了门,你总能从这里或是那里领悟到很多知识。 一旦我发现一些有意思的东西,我喜欢去感觉他们的源代码,看一看它是怎么办到的。 今天我想分享Addy Osmani的一行代码,这行代码对于你调试你的CSS是很有用的。为了可读性,我把它变成了3行。 注* Addy Osmani 是Google Chrome开发工程师,他前几天开发的字符串解 ...