CSS
Cairo960918
这个作者很懒,什么都没留下…
展开
-
网页小游戏-五子棋
设计思路如下:1.先采用的Math.random()方法决定哪一方先行;2.设置变量WFLAG = 1,BFLAG = 0时执白子,WFLAG = 0,BFLAG = 1时执黑子;3.设置标志[I]中,当为白子时标志[I] = 1,当为黑子时标志[I] = 2,且标志[I]不为0时不能落子;4.设置判断语句,当列5子时,竖5子,斜5子时为胜利,并计分;5.重新开始 - 重新初始...原创 2018-09-08 13:21:39 · 987 阅读 · 1 评论 -
vue实例--仿淘宝购物车
下面是一张众所周知的淘宝购物车页面,今天要讲解的案例就是用vue.js做一个类似的页面首先简单介绍一下可能会用到的一些vue.js的用法:v-bind,绑定属性;例如v-bind:class="{'class1':flag}",这是常用的绑定样式的方法,如果flag为true则class=class1;v-bind:src="image",image就是图像的路径;v-if="fl...原创 2018-11-03 22:24:40 · 3263 阅读 · 0 评论 -
网页特效--图片淡入淡出效果
1.通过CSS实现图片淡入淡出效果:主要是应用到了CSS3的动画特效中的animation-delay来打一个时间差,首先将第一张图片的opacity(透明度)设置为1,其他的图片则设置为0,在设置动画时长时根据你要显示的时间(如2s),则设置动画时长为2s x 图片张数,我的则是10s,相应的animation-delay则是从第一张为0开始,依次+2递增;代码如下:<!DO...原创 2018-11-05 19:45:21 · 3790 阅读 · 0 评论 -
通过原生js检测css3的动画是否结束
不知道大家在做网页的时候有没有碰到这种情况:当你使用CSS3的动画属性时,想要在动画结束后添加一系列操作,但往往这些操作可能会发生在与动画同时出现或者是在动画还没结束时就发生了。针对这种情况我们会使用js来监听动画是否结束即它的style的transition属性是否为transitionend;下面我们通过一个简单的例子来理解一下我这句话的含义:代码如下:<!DOCTYPE ...原创 2019-01-21 16:03:45 · 739 阅读 · 0 评论 -
原生JS编写小游戏--跳一跳
以下说的是闲暇编写的一个小游戏--跳一跳,类似于微信的跳一跳,大体实现功能有:1.先随机生成地图;2.按住按钮释放后完成动作并进行判断;首先po一下代码;代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta nam原创 2019-01-23 17:02:33 · 1995 阅读 · 2 评论