九门宁生

导航

2019年8月27日 #

bom案例3-放大镜

摘要: common中的代码 阅读全文

posted @ 2019-08-27 17:49 九门宁生 阅读(131) 评论(0) 推荐(0) 编辑

bom案例2-弹出层

摘要: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .login-header { width: 100%; text-align: center; height: 30px; font-size: 24px; line-height: 30px; } ul, li, ol, 阅读全文

posted @ 2019-08-27 17:45 九门宁生 阅读(90) 评论(0) 推荐(0) 编辑

bom案例1-div拖拽

摘要: common中的代码 阅读全文

posted @ 2019-08-27 17:30 九门宁生 阅读(189) 评论(0) 推荐(0) 编辑

bom-scroll

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; } #box { width: 100px; height: 100px; margin: 50px; border: 30px solid red; padding: 10 阅读全文

posted @ 2019-08-27 17:27 九门宁生 阅读(164) 评论(0) 推荐(0) 编辑

bom-client

摘要: Document 阅读全文

posted @ 2019-08-27 17:21 九门宁生 阅读(188) 评论(0) 推荐(0) 编辑

bom-offset

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; } #box { position: relative; width: 300px; height: 300px; background-color: red; overfl 阅读全文

posted @ 2019-08-27 17:19 九门宁生 阅读(167) 评论(0) 推荐(0) 编辑

bom-location

摘要: Document 阅读全文

posted @ 2019-08-27 17:12 九门宁生 阅读(138) 评论(0) 推荐(0) 编辑

bom-简单动画

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; } #box { position: relative; background-color: red; width: 100px; height: 100px; } </st 阅读全文

posted @ 2019-08-27 17:10 九门宁生 阅读(198) 评论(0) 推荐(0) 编辑

bom-倒计时

摘要: common中的代码 阅读全文

posted @ 2019-08-27 14:41 九门宁生 阅读(299) 评论(0) 推荐(0) 编辑

bom-setInterval

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="开始" id="btn1"> <input type="button" value="取消&qu 阅读全文

posted @ 2019-08-27 14:33 九门宁生 阅读(143) 评论(0) 推荐(0) 编辑

bom-删除提示

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; padding: 0; } #tip { width: 150px; height: 30px; background-color: lightgray; opacity: 阅读全文

posted @ 2019-08-27 13:56 九门宁生 阅读(150) 评论(0) 推荐(0) 编辑

bom-setTimeout

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="开始" id="btn1"> <input type="button" value="取消&qu 阅读全文

posted @ 2019-08-27 13:55 九门宁生 阅读(151) 评论(0) 推荐(0) 编辑

bom-页面加载事件

摘要: Document 阅读全文

posted @ 2019-08-27 13:36 九门宁生 阅读(282) 评论(0) 推荐(0) 编辑

bom-对话框

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="alert" id="btn1"> <input type="button" value="pr 阅读全文

posted @ 2019-08-27 13:30 九门宁生 阅读(155) 评论(0) 推荐(0) 编辑

window对象

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> // 当我们是用window的成员的时候,window可以省略 // window.document // window.alert('hello'); // 定义的全局变量都属 阅读全文

posted @ 2019-08-27 13:23 九门宁生 阅读(99) 评论(0) 推荐(0) 编辑

bom详解

摘要: BOM的概念 BOM(Browser Object Model) 是指浏览器对象模型,浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成,其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象。 我们在浏览器中的一些操作都可以使用B 阅读全文

posted @ 2019-08-27 10:46 九门宁生 阅读(482) 评论(0) 推荐(0) 编辑

键盘事件

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> </script> </head> <body> <input id="txt" type="text"> <script> // 键盘事件 // keydown 键盘按下的时候 // 阅读全文

posted @ 2019-08-27 10:19 九门宁生 阅读(142) 评论(0) 推荐(0) 编辑

阻止冒泡

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #box1 { width: 300px; height: 300px; background-color: red; } #box2 { width: 200px; height: 200px; backgr 阅读全文

posted @ 2019-08-27 10:18 九门宁生 阅读(146) 评论(0) 推荐(0) 编辑

取消默认行为的执行

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <a id="link" href="http://www.baidu.com">baidu</a> <script> var link = document.getElementBy 阅读全文

posted @ 2019-08-27 10:16 九门宁生 阅读(294) 评论(0) 推荐(0) 编辑

获取鼠标早盒子中的 位置

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; } #box { width: 300px; height: 300px; border: 1px solid red; margin: 100px 10px 10px 10 阅读全文

posted @ 2019-08-27 10:15 九门宁生 阅读(225) 评论(0) 推荐(0) 编辑