谈谈css3的混合模式

前言

在photoshop中,我们处理图片,在图层之间有混合模式,点击混合模式里面的选项,可以使图片实现不同的效果,这个混合模式在css3中也有实现!下面就来介绍一下css3的混合模式。css3的混合模式主要使用mix-blend-mode这个属性来实现的。当然,也可以用background-blend-mode。下面我就来介绍一下这2个属性吧!

mix-blend-mode

其实这个用法很简单,就是在你需要混合的div上面添加这个属性就可以了,例如如下:

mix-blend-mode: multiply;

multiply,这个就是我们ps中的正片叠底!

谈谈网页中实现逐帧动画

前言

我们在网页中经常需要一些动画效果,假如你的动画效果需要人为控制停止或者播放,我们一般就不会用gif来实现了!这里,就引出了我们今天讲到的逐帧动画!今天主要讲解几种方式来实现逐帧动画!大家可以根据项目情况来自己选择。功能最强大的要数jquery的spritely插件了,具体可以看:http://resource.haorooms.com/uploads/demo/media/animate/spritely/index.html ,文章后面也会讲到!

css3实现逐帧动画

ajax无刷新页面切换,历史记录后退前进解决方案

问题描述

我们在工作中常常遇到需要用ajax来显示下一页和上一页,ajax可以不刷新页面进行操作!但是,假如你想通过浏览器的历史记录返回上一页和下一页。那么ajax默认是做不到的!一般需求要历史返回的时候,我们通常不使用ajax。但是呢,假如一个页面中,只有一个地方是需要动态的上一页下一页,其他地方都是固定的,那么这种情况除了使用模板之外,我们使用ajax来操作显得格外方便!那么如何解决ajax历史记录的返回和前进呢?今天我们就一起来学习一下!

js中history相关API普及

首先我们来看看history相关的API。

history.state

当前URL下对应的状态信息。如果当前URL不是通过pushState或者replaceState产生的,那么history.state是null。

由UglifyJS代码压缩想到的

前言

最近休假了,所以博客文章和资源库一直没有更新。让大家久等了。今天我主要写写js代码压缩的一些小的细节吧!我之前的文章javascript实用技巧,js小知识,里面总结了一些js的小的技巧,今天这篇文章,主要是让我们理解js压缩的一些精华,以后我们在书写js过程中,可以写的更加简单,去除那些没有用的,多余的东西。当然,我今天不介绍js压缩中的单词简写。因为那样更加没有意义,让我们的代码变得晦涩难懂!

IF语句分支优化

我们看一下,在代码压缩过程中,if语句的分支是如何进行压缩的!

1 去除没用的if/else分支

如果if的条件是可预计算得到的常数结果,那么就可以忽略掉没用的if/else分支。

压缩前

if (true){ 
  A();
}else{ 
  B(); 
} 
if (false){ 
  C(); 
}else{ 
  D(); 
}

重温css的选择器

前言

css选择器,是前端的基本功,只要你是一个前端,这个一定要掌握!今天之所以要重温一下css选择器,主要是和大家再复习一下css选择器中的一些常用符号的使用,例如“+、~、^、$、>、*”等的使用!之所以要复习呢,是因为我一个写后端的哥们,前端写的也很好,但是他今天突然问我,css中加号和大于号是啥意思?我说,这个貌似jquery中也有吧!好吧,可能这些符号不常用,造成我们对这些符号的陌生!那么今天,我们一起再来复习一下吧!

我之前的文章

大家在右侧搜索框中搜索“选择器”,会发现,我之前写过css用伪类nth-child,进行奇偶行的选择。今天,关于css3伪类选择器,我就不多描述了!同时大家也可以看一下我之前写的“jquery常用选择器总结”,其实,jquery选择器和css选择器类似!特别是在属性选择和组合选择上面!另外,我在小工具里面,也写了css选择器,这个比较全,里面包含伪类、伪元素、属性等等!地址是:http://www.haorooms.com/tools/css_selecter/ 感兴趣的可以看一下!

css选择器之特殊符号