JavaScript

如何使用JavaScript操作CSS颜色

Web颜色是Web应用程序或页面中不可或缺的一部分,对于CSS处理颜色总是非常的简单和单一。但很多时候我们需要一些特殊的效果,比如随机色等。那么我们就需要借助JavaScript来完成。在学习如何使用JavaScript操作CSS颜色之前,我们需要对CSS如何设置颜色有一个基本的了解。CSS设置颜色模式有多种,最为常见的模型有:RGBHSL。我们先来看一下这两种颜色模式。

如何使用JavaScript构建模态框插件

作为一位Web开发人员而言,模态框(Modal)并不会陌生。就我个人而言,我更为熟悉的是怎么通过CSS来编写一个模态框以及怎么通过CSS给模态框添加一些动效。正好最近工作中也和Modal框杠上了。另外想更好的设计一个模态框用来满足业务需求的普遍性和实用性,甚至是达到可配置性。所以一直在探究模态框相关的知识,同时正好看到了@Ken Wheeler的教程,对于我这样的菜鸟,能很好的了角如何使用原生的JavaScript来构建一个可用的模态框插件,另外为以后如何使用Vue构建更为灵活的模态框组件打下坚实的基础。如果你对该文章感兴趣,或者你也正在加强JavaScript的学习和实战,欢迎继续往下阅读,或许对你有所帮助。

FLIP技术给Web布局带来的变化

用户界面是最直观的呈现给用户,而其中动画在这方面又扮演着重要的角色。正如@Nick Babich所说:动画将用户界面带入生活。而且,UI动画在用户体验方面也是重要的一环。特别是移动端开发的同学更清楚这一点。移动应用中的UI动画是体验的核心部分之一,而不是事后的想法。可是呢?事实上我们经常遇到的Web运用程序或App只是从一个视图跳到另一个视图,并没有给用户足够多的时间来处理当前环境中刚刚发生的事情。同时,很多同学都认为,动画通常在用户体验方面仅仅是锦上添花,并且被认为是不必要的、过渡的或太复杂的,无法实现的,也是因为这些原因,UI动画在很多Web应用中被忽略了。更糟糕的是,缺乏意义的动画会给自己产品体验方面带来损害。

初探CSS对象模型(CSSOM)

今年花了不少的时间在学习DOM相关的知识,经过这段时间的学习,可以通过一些JavaScript的API操作和处理Web页面上的HTML元素。在Web中除了DOM之外还有另外一个对象模型:CSS对象模型(即CSSOM)。或许你已经在项目中已经用过了,只不过没有意识到这一点而以。今天这篇文章中,我们主要来一起探讨有关于CSSOM相关的特性。

如何构建一个简单的摄像头组件

这篇文章主要跟着@David East的《HOW TO BUILD A SIMPLE CAMERA COMPONENT》 学习。学习如何使用MediaDevices API获取摄像头的访问权限,然后将相关的流通过video元素来播放。并且将视频流通过canvas元素转换为blobbase64格式的图片。并且依赖于自定义元素将这些功能封装成一个简单的摄像机组件。感兴趣的同学,请继续往下阅读。

DOM系列:DOM事件的传播

通过前面的DOM事件模型事件绑定的姿势两节的学习,我们对JavaScript中的DOM事件有了一定的基础。但忽略了有关事件如何被触发的重要细节。

DOM系列:事件绑定的姿势

在上一节中,学习和了解了DOM事件模型,了解到JavaScript中每种事件模型都有其自己独具的特性。不同的事件模型中,绑定DOM事件的姿势也将略有差异,在这一节中,我们一起来学习JavaScript中DOM事件是如何绑定的。在JavaScript中,给DOM元素绑定事件主要分为两大类:HTML中直接绑定JavaScript中绑定

DOM系列:DOM事件模型

通过上一节的学习,对DOM事件有了一个简单的了解。但这只是学习DOM事件相关知识的起步点。在JavaScript中常见的事件模型有:DOM基本事件模型DOM Level 2事件模型IE事件模型DOM Level 3事件模型自定义事件模型。每种事件模型都有其自己独具的特性。只有了解了DOM事件模型之后,才可以为后续的DOM事件打下一个基础。今天来了解一下DOM事件的模型。

DOM系列:DOM事件简介

如果你浏览过早期的Web网站,或许你已经发现了这些Web站点除了能提供查阅信息之外,无其他作用可言。这样的Web站点其实是非常无聊的。那是因为Web站点没有提供人与机器的互动行为。激不起用户的兴趣。造成这种现象的原因很简单。Web应用程序或者Web站点存应该是为了响应用户对它们所做的事情。好比,我们每天一大早起床时就想好了一天要做些什么,这样每天都有动力,也变得充实。那么在Web应用或Web网站上其实也是类似的,Web网站之后做的事情很大程度上取决于你告诉他们做什么。这样一来,Web网站会变得有趣的多。

DOM系列:DOM操作小结

DOM是JavaScript的基础之一,自己学习DOM的操作也有一段时间了,到今天为止DOM系列的教程刚好有十篇了,这部分都主要是围绕DOM操作的笔记。主要围绕DOM元素的增、删、改、查,DOM节点的操作以及元素尺寸、位置获取和设置等知识。今天这篇文章主要是小结一下。希望对一些像我这样的初学者有所帮助。

页面

返回顶部