微信网页悬浮窗交互效果的web实现

2018年06月6日 by 张 鑫旭 阅读 49327 次, 今日 5 次

微信更新后,发现多了个悬浮窗功能。公众号阅读,网页浏览回退后默认会出现。再点击,可以回到刚才阅读的地方。于是,再也不会遇到回复老婆的信息,再切换回来重新找刚才阅读东西的麻烦了。我个人觉得是很有用的一个功能。

其交互效果,也被不少人称赞。例如,窗口会收缩到悬浮按钮中,悬浮按钮可以拖到右下角取消浮窗。这些交互效果呢,使用web前端技术也是可以实现,有demo,有截图,有必要的源代码展示,希望本文的内容能够对您的学习有所帮助。

阅读全文…

《CSS世界》女主角诚寻靠谱一起奋斗之人

2018年06月5日 by 张 鑫旭 阅读 50665 次, 今日 3 次

上图这位美女诚寻靠谱一起奋斗之人,详细信息见文章介绍……

阅读全文…

突破本地离线存储5M限制的JS库localforage简介

2018年06月4日 by 张 鑫旭 阅读 51937 次, 今日 5 次

说到本地存储数据,我们首先想到的是localStorage,应该很多小伙伴都用过,使用很简单。然而,localStorage却有不少确定,如存储容量限制,只支持字符串等。localforage的作用就是用来规避上面localStorage的缺点,同时保留localStorage的优点而设计的。具体是怎么规避的呢?最终使用效果又是怎样?

即将为你揭晓……

阅读全文…

JS实现照片图片变成黑白线条线稿

2018年06月3日 by 张 鑫旭 阅读 38594 次, 今日 11 次

本文演示如何使用JS实现照片图片变成黑白线稿图片效果,照片变成黑白简单线条有什么用呢?我能想到的就有5个用途,具体是什么,不妨进来看一看~

阅读全文…

小tips: 点击页面出现富强、民主这类文字动画效果

2018年05月31日 by 张 鑫旭 阅读 39037 次

如何实现点击页面出现富强、民主这类文字动画效果?很简单,复制本文提供的源代码,效果立即就出现了。快进来看看怎么实现的吧?

阅读全文…

不借助Echarts等图形框架原生JS快速实现折线图效果

2018年05月25日 by 张 鑫旭 阅读 56077 次, 今日 2 次

不借助Echarts等图形框架原生JS快速实现折线图效果,文章本身没什么,关键文章底部有个有奖竞猜,猜中有机会免费赠送《CSS世界》签名版,要不过来试试。

阅读全文…

二次元live2d看板娘效果中的web前端技术

2018年05月21日 by 张 鑫旭 阅读 128357 次, 今日 17 次

想要在网页中插入看板娘效果,其实很简单,复制复制,粘贴粘贴代码就有了。但具体原理和技术实现是怎样的呢?本文就将介绍Live2D相关技术以及在web网页中的应用。有非常卡哇伊的demo,有必要的截图和源代码展示,希望本文的内容能够对您的学习有所帮助。

阅读全文…

纯CSS实现蜡烛、火焰以及熄灭后烟雾效果

2018年05月16日 by 张 鑫旭 阅读 39419 次, 今日 2 次

本文要展示的效果主要三部分:直立的红烛、跳动的火焰,腾起的烟雾,这三部分都是纯CSS实现的,有兴趣可以看看。

阅读全文…

在同事的安利下,试用了下接口管理平台YApi

2018年05月9日 by 张 鑫旭 阅读 69959 次, 今日 5 次

在同事的安利下,试用了下接口管理平台YApi,用了下,还行。自己写高保真的交互原型,需要可以有相当真实的API请求数据,例如出错,请求延时模拟,极端数据处理等。YApi正好可以满足这方面的需求,特记录与分享下。

阅读全文…

windows系统下批量删除OS X系统.DS_Store文件

2018年05月7日 by 张 鑫旭 阅读 71972 次, 今日 6 次

设计师用的电脑是高大上的Mac Pro,开发用的电脑是高大的传统台式机,操作系统是windows,于是,设计师给开发传打包图片的时候,一解压,我了个擦,每个文件夹中间都有一个.DS_Store文件,好烦哦,如何批量清除这些烦人的文件呢,其实很简单,只会一丢丢JS的我也能写一个小工具搞定,我是如何搞定的呢?一起进来看看吧~

阅读全文…