• JS图片赖加载例子

    1 ! DOCTYPE html 2 html lang ="en" 3 head 4 meta charset ="UTF-8" 5 meta name ="viewport" content ="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" 6 title 图片赖加载2017-10-17 / title 7 style type ="text/css" 8...

    2018-06-24 00:31:50

  • 随机点名系统

    !DOCTYPE html html lang="en" head meta charset="UTF-8" title随机点名/title style type="text/css" td{ text-align: center; } /style /head body table width="760" border="1" height="460" align="center" h1 align="center"随机点名系统/h1 tr td/td td/td td/...

    2018-06-24 00:31:47

  • 原生JS获取元素的位置与尺寸

    1、内高度、内宽度: 内边距 + 内容框 clientWidth clientHeight 2、外高度,外宽度: 边框 + 内边距 + 内容框 offsetWidth offsetHeight 3、上边框、左边框 clientTop clientLeft 4、元素的大小及其相对于视口的位置 getBoundingClientRect() //x\y:元素的左上角和父...

    2018-06-24 00:31:42

  • 碰撞运动+重力+拖拽+摩擦力

    !DOCTYPE htmlhtmlheadtitle/titlemeta charset='utf-8' / style #div1{width: 100px; height: 100px; background: red; position: absolute; left: 0; top: 40px;}/stylescript//添加拖拽功能window.onload=function(){var oDiv=document.getElementById('div1');//当...

    2018-06-24 00:31:41

  • Javascript 获取验证码60秒倒计

    button id= " time " 获取验证码/button var countdown = 60 ; var but = document.getElementById( ' time ' );but.addEventListener( ' click ' , function (e) { setTime( this );})function setTime (elem) { if (countdown === 0 ) { elem.innerHTML = " 获取验证...

    2018-06-24 00:31:16

  • 【WebGL】《WebGL编程指南》读书笔记——第2章

    一、前言 最近看了《 WebGL编程指南 》这本书,发现还是很有意思的,故每章阅读后做个笔记。 二、正文 Example1 :在canvas中绘制2D矩形 !DOCTYPE htmlhtml lang= " en " head meta charset= " utf-8 " / titleDraw a blue rectangle (canvas version)/title /head bod...

    2018-06-24 00:31:00

  • JavaScript面向对象基础与this指向问题

    前 言 我们的程序语言经历了从“面向机器”、到“面向过程”、再到“面向对象”的一个过程。而JavaScript是一门基于对象的一门语言,它介于面向过程与面向对象之间。在学习JavaScript的过程中,OOP是非常重要的一环,下面我们来一起探讨一下JS中的面向对象吧!!! 1...

    2018-06-24 00:30:29

  • 利用contains方法实现:点击界面空白部分关闭当前面板

    今天给组件添加一个小功能,需要点击界面空白部分关闭当前组件,找了好一会儿,发现主要是jquery的方法,js原生几乎没有,崩溃。。好不容易弄出来了,就给自己做个笔记吧,ps:我用的react 要用到的方法: 1.contains:就是判断某个元素是不是选定元素的子元素(或本身...

    2018-06-24 00:31:26

  • [js高手之路]封装运动框架实战左右与上下滑动的焦点轮

    在这篇文章[js高手之路]打造通用的匀速运动框架中,封装了一个匀速运动框架,我们在这个框架的基础之上,加上缓冲运动效果,然后用运动框架来做幻灯片(上下,左右),效果如下:【 选择器用的是html5的,你的浏览器需要支持html5新选择器,才能看见效果额 】 1 2 3 4...

    2018-06-24 00:31:14

  • 从给数组中的对象去重看Javascript中的reduce()

    假设有这样一个数组: let person = [ {id: 0, name: "小明" }, {id: 1, name: "小张" }, {id: 2, name: "小李" }, {id: 3, name: "小孙" }, {id: 1, name: "小周" }, {id: 2, name: "小陈" }, ] 我们想去掉数组中id重复的对象,比如同样id为2的两个对象—— {id: 2, n...

    2018-06-24 00:31:09

2