夜光序言:
孤高所以至高。
所谓真正的英雄就是一个人。因为孤高所以强大。
没有持有羁绊也就是说没有必须守护的东西。必须守护的东西换言之就是弱点。
因此没有弱点、没有必须守护的东西、和别人没有联系的人才是最强的。
正文:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.xiaomi {
width: 512px;
height: 400px;
border: 1px solid #f00;
margin: 100px auto;
overflow: hidden;
position: relative;
}
.xiaomi span {
position: absolute;
left: 0;
width: 100%;
height: 200px;
cursor: pointer;
}
.up {
top: 0;
}
.down {
bottom: 0;
}
</style>
</head>
<body>
<div class="xiaomi">
<img src="mi.png" alt=""/>
<span class="up"></span>
<span class="down"></span>
</div>
</body>
</html> //css 部分
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.xiaomi {
width: 512px;
height: 400px;
border: 1px solid #f00;
margin: 100px auto;
overflow: hidden;
position: relative;
}
.xiaomi span {
position: absolute;
left: 0;
width: 100%;
height: 200px;
cursor: pointer;
}
.up {
top: 0;
}
.down {
bottom: 0;
}
#pic {
position: absolute;
top: 0;
left: 0;
}
</style>
</head>
<body>
<div class="xiaomi">
<img src="mi.png" alt="" id="pic"/>
<span class="up" id="picUp"></span>
<span class="down" id="picDown"></span>
</div>
</body>
</html>
<script>
function $(id) { return document.getElementById(id);}
var num = 0; // 控制图片的top值
var timer = null; // 定时器名称
$("picUp").onmouseover = function(){
// alert(11);
clearInterval(timer);
timer = setInterval(function(){
num -= 3;
num >= -1070 ? $("pic").style.top = num + "px" : clearInterval(timer);
},30);
}
$("picDown").onmouseover = function(){
clearInterval(timer);
timer = setInterval(function(){
num++;
num < 0 ? $("pic").style.top = num + "px" : clearInterval(timer);
},30);
}
$("picUp").parentNode.onmouseout = function() {
clearInterval(timer);
}
</script>
五秒后自动关闭广告 |
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
img {
position: absolute;
top: 0;
}
#left {
left: 0;
}
#right {
right: 0;
}
</style>
</head>
<body>
<img src="1.gif" alt="" id="left"/>
<img src="2.gif" alt="" id="right"/>
<p>夜光设计</p>
</body>
</html>
<script>
function $(id) { return document.getElementById(id);} // id函数
function hide(id) { // 隐藏函数
$(id).style.display = "none";
}
function show(id) {
$(id).style.display = "block";
}
setTimeout(closeAd,5000);
function closeAd() {
hide("left");
hide("right");
}
</script>
复习
- 按钮不可用 disabled = “disabled” || true
- setTimeout 只执行一次 setInterval 执行很多次
- 递归调用 : 函数自己调用自己 函数递归调用 不提倡用函数名 而喜欢用的是 arguments.callee 返回的是 正在执行的函数 本身
- 逻辑运算符 与 && 或 || 非 ! ! > && > ||
- 2&&0 0 1&&8 0&&3 0 1||0
- 转换为 字符型
var num = 12345;
num+ “”
String(num);
num.toString(); 10进制
num.toString(2) 二进制 - 根据字符位置返回字符
charAt(索引号)
var txt = “abcde”;
txt.charAt(3); d
charCodeAt(3) unicode 编码 97 100
根据字符返回位置
跟 charAt() 相反的 根据 字符 返回的是 位置
返回前面起第一个字符的位置
indexOf(“字符”);
它是从 前面开始数(从左边开始数), 而且只找第一个, 然后返回改字符的位置, 索引号都是从0开始的。 返回的是个数值。
var txt = “abcdef”;
alert(txt.indexOf(“d”)) 结果就是 3
如果找不到该字符 返回 -1
返回后面起第一个字符的位置
lastIndexOf(参数:索引字符串)
从后面开始数 同上
var txt = “abcdef” ;
txt.lastIndexOf(“d”); 3
返回的值,还是从 左边开始 数的 索引号 。
网址编码
我们知道一个网址 自己的网址, 不同页面也有自己id网址, 我们经常会做一些, 把网址送入到后台。 但是后台再处理的 不认识比如 换行啊 等特殊符号的 ?
var url = “http://www.优快云.cn?name=cz”
所以我们要实现编码,然后再传到后台。
encodeURIComponent() 函数可把字符串作为 URI 组件进行编码
decodeURIComponent() 函数可把字符串作为 URI 组件进行解码