键盘事件

键盘事件

  • onkeydown 会在键盘按下时触发
  • onkeypress 会在键盘按下并抬起时触发
  • onkeyup 会在键盘抬起时触发
1
2
3
4
document.onkeydown = function (event) {
        var e = event || window.event || arguments.callee.caller.arguments[0];
        alert(e.keyCode);
    };
Javascript

more >>

Javascript鼠标事件总结

Javascript鼠标事件总结

demo

  • mousedown：鼠标按下
  • mouseup：鼠标弹起
  • click：鼠标点击
  • dblclick：鼠标双击
  • contextmenu：鼠标右击
  • mouseover：鼠标移到目标上
  • mouseout：鼠标移出目标上
  • mousemove：鼠标在目标上移动
Javascript

more >>

gulp学习

gulp是一个优秀的自动化构建的工具，它的核心在于流式的操作和简单易学上手的API，下面我们就来学习搭建一个简单的工程框架。

web前端

more >>

js-type-writing

我们简单的通过js实现打字的功能，直接看代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div id="myWriting" write-data="我们一起来学习web前端的知识吧！Let's get together to learn front end!">

</div>

<script>
	var myWrite = document.getElementById('myWriting');
    var text = myWrite.getAttribute('write-data');
    typeWriting(text, 0);

    function typeWriting(txt, n) {
        if (txt.length > n) {
            n++;
            myWrite.innerHTML = txt.substring(0, n);
            setTimeout(function () {
                typeWriting(txt, n);
            }, 100)
        } else {
            typeWriting(txt, 0);
        }
    }
<script>
Javascript

css画3d小球

通过css的background画3d的小球
1
2
3
4
5
6
7
<span style="display:inline-block;width: 30px;height:30px;border-radius:15px;opacity:1;background:-webkit-radial-gradient(30% 30%,#fff 5%,blue 95%);"></span>

<span style="display:inline-block;width: 30px;height:30px;border-radius:15px;opacity:1;background:-webkit-radial-gradient(50% 20%,#fff 5%,blue 95%);"></span>

<span style="display:inline-block;width: 30px;height:30px;border-radius:15px;opacity:1;background:-webkit-radial-gradient(30% 30%,#fff 5%,red 95%);"></span>

<span style="display:inline-block;width: 30px;height:30px;border-radius:15px;opacity:1;background:-webkit-radial-gradient(60% 30%,#fff 5%,red 95%);"></span>
示例




web前端

localhost

localhost和127.0.0.1的区别

  • 127.0.0.1是一个回送地址，指本机（本地地址）；

  • localhost是一个指向127.0.0.1这个本地IP的域名（本地服务器）。

    在操作系统中一般配置localhost与127.0.0.1绑定在一起。

    当用户访问localhost会通过本地的hosts文件，将localhost解析到相应设置的IP（127.0.0.1）

    在hosts文件中可以配置： 127.0.0.1 localhost

  • localhost 访问不需要经网卡传输，不受网络防火墙和网卡相关的限制

  • 127.0.0.1 访问需要通过网卡传输，受网络防火墙和网卡相关的限制

    一般访问本地服务用localhost，不会解析成IP，也不用占用网卡，网络资源

    localhost访问会有本机当前用户权限，127.0.0.1访问会通过网络再去访问本机，有可能涉及到权限问题二不能访问

    注：web开发调试时，当遇到localhost不能使用，或跳转到不相关的网址，极有可能是hosts文件配置有误的问题。

乱炖