2018年06月_蕙惠子

原创三十七、jQuery多动轮播动画混叠效果

利用枚举对象封装方法，通过参数传递建立不同的动画模型并调用执行对应动画；主要是为了演示如何对动画混叠进行封装一、搭建整体模型1.封装层级排序方法//封装层级排序方法sortimg:function(){ $(".ulinfo li").each(function(index){ $(this).css({"zIndex":$(".ulinfo li").length-index...

2018-06-27 12:19:56 206

原创三十六、jquery手风琴效果

1.基本结构样式2.添加手风琴展开事件：当鼠标进入某个图片，展开当前图片，其同胞兄弟合起来，并设置相应的样式注意：需要使用stop()处理连续多次滑动的情况；$(this).mouseenter(function(){ //设置span属性 $(this).children("span").css({ borderStyle:"none", backgrou...

2018-06-26 11:37:25 133

无缝轮播有两种方式，一种可以让ul中的每个li进行移动，另外一种时令整个ul进行移动。无缝轮播效果之前用js写过一次，以下是用jQuery分别实现这两种方式；一、第一种控制每个li标签移动实现无缝轮播1.基本布局样式2.实现自动向左轮播采用枚举对象封装函数的方法，封装自动轮播的方法:利用jQuery的自定义动画animate改变第一张图片的marginLeft令其向左移动，当移动结束时将第一张...

2018-06-26 09:32:55 837

原创三十四、jquery练习手机点餐demo

一、所用知识点：1.jquery事件绑定方法：(1) bind():类似于js中事件的监听方法；语法: $(selector).bind(event,data,function,map) selector:被选元素；event:添加到元素的事件（一个或多个）；data:可选，传递到函数的额外数据；function:执行函数；map:事件映射 ({event:function, event:...

2018-06-22 20:17:51 824

原创三十三、手机触屏touch、手势、重力监听事件

一、手机触屏事件1.常见的触屏事件：touchstart:触摸开始时候触发touchmove：手指在屏幕上滑动的时候触发touchend：触摸结束的时候触发touchcancel：当一些更高级别的事件发生的时候（如电话接入或者弹出信息）会取消当前的touch操作，即触发ontouchcancel。一般会在ontouchcancel时暂停游戏、存档等操作。 2.每个触摸事件包含三个触摸列表，每...

2018-06-17 00:23:46 821

原创三十二、cookie数据、JSON及JSON.parse()方法

一、JS中cookie数据1.cookie：用于存储web页面的用户信息。 cookie是一些数据，存储于电脑上的文本文件中，当web服务器向浏览器发送web页面时，在连接关闭后，服务端不会记录用户的信息。2.作用：解决“如何记录客户端的用户信息”：当用户访问 web 页面时，他的名字可以记录在 cookie 中。在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。 3.Ja...

2018-06-16 21:23:17 1010

原创三十一、Html5中的web存储

一、在客户端存储数据的两种方法：1.localStorage:没有时间限制的数据存储； sessionStorage:针对一个session的数据存储；由cookie完成，但cookie不适合大量数据的存储，因为其由每个服务器的请求来传递，使得cookie速度很慢且效率不高 2.在h5中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。对于不同的网站，数据存储于不同的区域，并且一个网站...

2018-06-16 20:36:03 144

原创三十、JS几种跨域方法和原理

Ps:浏览器的同源策略:其限制之一就是不能通过ajax的方法请求不同源中的文档。限制二是浏览器中不同域的框架之间不能进行js的交互操作。一、什么是跨域？1.JS跨域是指通过js在不同的域之间进行数据传输或通信，如Ajax向一个不同的域请求数据，或者通过JS获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，即为不同的域；Eg:网址是 http://baidu.co...

2018-06-12 20:24:11 189

原创二十九、JS原生Ajax请求

1.同步，异步区别：同步：通俗理解代码必须按顺序执行，后面代码必须等待前面代码执行完成才能执行，即当客户端发送请求到服务器端，服务器返回响应之前，客户端都处于等待，卡死状态异步：前后代码同时执行，后面代码不需等待前面代码执行完成，即客户端发送请求到服务器端，无论服务器是否返回响应，客户端都可随意做其他事情不会被卡死。2.Ajax概述：Ajax是一种快速创建动态网页的技术。通过后台与服务器...

2018-06-11 16:06:56 172

原创二十八、JS飞机大战demo

一、第一步：创建地图分析：创建的地图，要制造飞机一直向上飞行的效果，则要背景无缝循环向下轮播，和之前的无缝轮播一直，只是改变的是top值；Html代码：<div class="map"> <div class="bgmap"></div> <div class="bgmap"></div>&amp

2018-06-07 18:32:10 4866 2

原创二十七、JS经典贪吃蛇demo

一、首先创建地图1.封装一个地图的类；function Map(){ //设置地图的相关属性 this.width=1200; this.height=600; this.position="relative"; this.backgroundColor="black"; this.margin="0 auto"; //封装接受地图对象的属性 th...

2018-06-07 18:28:59 277

weixin_40976555的博客