JAVASCRIPT
Cairo960918
这个作者很懒,什么都没留下…
展开
-
JavaScript动态网页-飘落的雪花
设计思路:1.定义一定数量的雪花层,每层包含一个雪花;2.雪花水平方向左右摇摆则是Math.sin()方法,正弦函数;3.雪花垂直方向则是采用自加方法每次增加一定距离;4.雪花每个大小不一;采用的方法如下:Math.ceil()方法:返回大于等于其数字参数的最小整数,如Math.ceil(3.4)=4;Math.random()方法:返回介于0和1之间的随机数(含0但不包括...原创 2018-09-07 19:20:40 · 1756 阅读 · 0 评论 -
原生JS编写小游戏--跳一跳
以下说的是闲暇编写的一个小游戏--跳一跳,类似于微信的跳一跳,大体实现功能有:1.先随机生成地图;2.按住按钮释放后完成动作并进行判断;首先po一下代码;代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta nam原创 2019-01-23 17:02:33 · 1942 阅读 · 2 评论 -
通过原生js检测css3的动画是否结束
不知道大家在做网页的时候有没有碰到这种情况:当你使用CSS3的动画属性时,想要在动画结束后添加一系列操作,但往往这些操作可能会发生在与动画同时出现或者是在动画还没结束时就发生了。针对这种情况我们会使用js来监听动画是否结束即它的style的transition属性是否为transitionend;下面我们通过一个简单的例子来理解一下我这句话的含义:代码如下:<!DOCTYPE ...原创 2019-01-21 16:03:45 · 707 阅读 · 0 评论 -
JavaScript中的变量提升和严格模式
1.什么是变量提升所谓的变量提升指的是:函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体(作用域)的最顶部。下面我们通过一个例子来详细说明一下。 //变量声明在使用之前 var x; console.log(x);//undefined //变量声明在使用之后 console.log(y);//undefined var y;...原创 2018-12-16 10:39:21 · 420 阅读 · 0 评论 -
网页特效--图片淡入淡出效果
1.通过CSS实现图片淡入淡出效果:主要是应用到了CSS3的动画特效中的animation-delay来打一个时间差,首先将第一张图片的opacity(透明度)设置为1,其他的图片则设置为0,在设置动画时长时根据你要显示的时间(如2s),则设置动画时长为2s x 图片张数,我的则是10s,相应的animation-delay则是从第一张为0开始,依次+2递增;代码如下:<!DO...原创 2018-11-05 19:45:21 · 3705 阅读 · 0 评论 -
浅谈JavaScript中的apply,call,bind的使用
1.原创 2018-11-24 19:05:46 · 211 阅读 · 0 评论 -
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 · 3213 阅读 · 0 评论 -
网页小游戏-五子棋
设计思路如下: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 · 949 阅读 · 1 评论 -
JavaScript学习-键盘码
思路如下:1。创建函数onkeyboradEvent(事件),根据开关针对不同按键代表不同的数字来执行;2.创建的keydown事件监听器针对每一次键盘按下事件进行分析。<!DOCTYPE html><html><head><meta charset="utf-8"><title>keyboard</title&am原创 2018-09-08 22:23:58 · 341 阅读 · 0 评论 -
JavaScript动态网页-时钟
设计思路:1先建立一个数组保存带有0〜9数字的10张图片;2.通过GETDATE()获得本地时间保存在变量数值指明MyTime中;3. getHours()返回的是24进制即0~23的整数,getMinutes()方法返回一个处于0到59之间的整数,getSeconds()方法返回一个处于0到59之间的整数;4.通过的setTimeout()每隔1秒调用一次显示()函数改变图像对象的S...原创 2018-09-07 22:03:13 · 501 阅读 · 0 评论