Jane_Juan小姐的博客

菜鸟一枚,记录前端成长轨迹,个人博客正在建设中,地址为https://git.zhangxiaojuan.club/...

CSS居中小谈-上下左右居中

http://web.jobbole.com/88804/ 内联元素居中方案 水平居中设置: 行内元素 设置 text-align:center; Flex布局 设置display:flex;justify-content:center;(灵活运用,注意兼容性和前缀) 垂直居中设置...

2016-11-26 12:05:59

阅读数 137

评论数 0

HTML5本地存储Localstorage

原文链接:http://caibaojian.com/html5%e6%9c%ac%e5%9c%b0%e5%ad%98%e5%82%a8localstorage.html 基础知识 vialocalstorage存储对象分为两种:原文来自:http://caibaojian.com/html5...

2016-11-26 10:37:05

阅读数 162

评论数 0

行星旋转案例canvas-konva.js未封装前的代码

静止状态下: 整体代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo...

2016-11-25 17:24:33

阅读数 991

评论数 0

面向对象封装--行星旋转案例canvas-konva.js

如图所示案例: 具体讲解:在stage上面绘制一个背景层和一个运动层,背景层保持不变,运动层会随着Animation设置的而运动,而且当鼠标经过运动层的圆圈时,运动速度会明显变慢,鼠标移开后,立马恢复原来运动速度。CSS3和HTML5放入一组中,该所属组顺时针旋转,JS所属组逆时针旋转;字体随着...

2016-11-25 17:19:40

阅读数 1756

评论数 0

面向对象canvas_进度条-Konva.js

效果图如下: html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo...

2016-11-24 19:11:43

阅读数 842

评论数 0

Konva.js--矩形案例

body { padding: 0; margin: 0; background-color: #f0f0f0; overflow: hidden; } var stage=new Konva.Stage({ container:'co...

2016-11-24 14:27:04

阅读数 1399

评论数 0

canvas人物走动--未进行JS封装时的源代码

img 点击改变方向 左 右 前 后 (function(){ var canvas=document.getElementById('canvas'); var ctx=canvas.getContext('2d'); canvas.width=6...

2016-11-23 17:59:04

阅读数 603

评论数 0

canvas人物动画—走路

如图所示,小人在一直走动,并且点击上下左右时,会改变人走动的方向 源图片: 源代码: html代码: 面向对象 你的浏览器不支持canvas ← → ↑ ↓ (function(){ var canvas=document....

2016-11-23 17:54:37

阅读数 4357

评论数 0

Canvas扇形

Canvas案例- 你的浏览器不支持canvas,请升级浏览器 (function(){ var canvas = document.querySelector('#cavsElem'); var ctx = canvas.getContex...

2016-11-21 21:00:39

阅读数 578

评论数 0

arttemplate两种用法

标准讲解链接:http://www.jq22.com/jquery-info1097 用法一、放在script标签里面 {{if longitude}} 经度:{{longitude}} 纬度:{{latitude}} 海拔高度:{{altitude}...

2016-11-18 16:27:12

阅读数 2659

评论数 0

jquery的jsonp.web

$(function(){ $.ajax({ type:"get", asyn:false, url:"./jsonp.php", // 相当于: // url:"./jsonp.php?cb=callback&q...

2016-11-18 14:39:10

阅读数 134

评论数 0

封装Ajax

EMS #ems{ position: absolute; left: 50%; width: 400px; height: auto; margin-left: -200px; background: lightGreen; text-align...

2016-11-17 21:03:54

阅读数 147

评论数 0

Ajax与xml数据格式// Ajax与json数据格式

xml兼容性很好,任何浏览器都可以调用其中的数据 1、Ajax与xml数据格式 data.xml //文档声明 三国演义 文学 描述 水浒传 文学 草寇or英雄豪杰 西游记 文学 妖魔鬼怪牛鬼蛇神什么都有 红楼梦 文学...

2016-11-17 12:44:07

阅读数 149

评论数 0

ajax中responseText与responseXML区别

1、"responseText”属性以字符串形式返回HTTP响应;“responseXML”属性以XML形式返回HTTP响应。      var message = xmlHttp.responseText;       telText.value = message; 2、“...

2016-11-17 11:34:25

阅读数 340

评论数 0

js中window.location.search的用法和作用。

用该属性获取页面 URL 地址: window.location 对象所包含的属性 如图就是取出url中的参数。 JS 脚本捕获页面 GET 方式请求的参数?其实直接使用 window.location.search 获得,然后通过 split 方...

2016-11-16 09:44:02

阅读数 1064

评论数 0

为什么不建议使用*{padding:0;margin:0;}进行reset?reset的目的是什么??

原因:因为*需要把所有的标签都遍历一遍,当网站较大时,样式比较多,这样写就大大的加强了网站运行的负载,会使网站加载的时候需要很长一段时间,因此一般大型的网站都有分层次的一套初始化样式。 建议使用:html,body{padding:0;margin:0;} 初始化的真正目的不上为了去掉默认的边...

2016-11-12 19:43:07

阅读数 696

评论数 0

CSS中一个冒号和两个冒号有什么区别

一个冒号是伪类,两个冒号是伪元素 伪类可以独立于文档的元素来分配样式,且可以分配给任何元素,逻辑上和功能上类类似,但是其是预定义的、不存在于文档树中且表达方式也不同,所以叫伪类。 伪元素所控制的内容和一个元素控制的内容一样,但是伪元素不存在于文档树中,不是真正的元素,所以叫伪元素。 伪类有:...

2016-11-12 09:23:49

阅读数 7363

评论数 0

2016-11-11

今天双十一,可是我没有购物的心情,因为头疼,真的好难受。不晓得为什么会这样,兴许是早上吃了碗螺蛳粉吧,太辣了,影响了自己的胃。总之,今天整个人各种不舒服……哎,我以后一定要饮食规律,早上要吃得清淡点

2016-11-11 19:24:41

阅读数 174

评论数 0

面向对象的程序设计-原型模式(案例:下拉菜单)

《javascript高级程序设计》第三版147页 案例效果如图: 代码如下 无标题文档 *{ padding:0; margin:0; list-style:none;} .all{ width:440px; height:30px; background:url(img/bg.j...

2016-11-10 15:21:18

阅读数 322

评论数 0

tab栏再改进,为了减轻后台压力,鼠标快速滑过不响应,慢慢滑过才响应

1、 var arrLi = str.getElementsByTagName("li"); var arrDiv = str.getElementsByTagName("span"); ...

2016-11-09 20:46:02

阅读数 209

评论数 0

提示
确定要删除当前文章?
取消 删除
关闭
关闭