javascript——event事件

event : 事件对象 , 当一个事件发生的时候,和当前这个对象发生的这个事件有关的一些详细的信息都会被临时保存到一个指定地方-event对象,供我们在需要的调用。飞机-黑匣子

事件对象必须在一个事件调用的函数里面使用才有内容
事件函数:事件调用的函数,一个函数是不是事件函数,不在定义的决定,而是取决于这个调用的时候

 

兼容
ie/chrome : event是一个内置全局对象
标准下 : 事件对象是通过事件函数的第一个参数传入

如果一个函数是被事件调用的那么,这个函数定义的第一个参数就是事件对象

clientX[Y] : 当一个事件发生的时候,鼠标到页面可视区的距离

<script>
    // alert(event);    //undefined

    /*document.onclick = function(){
        alert(event);    //object MouseEvent 鼠标事件
    };*/

    function fn1(ev){
        // alert(event);
        // alert(ev);
        var ev = ev || event;
        // alert(ev);
        alert('鼠标到可视区左边(X轴)距离:' + ev.clientX + ',鼠标到可视区上边(Y轴)距离:' + ev.clientY);
    }
    // fn1();            //不是事件调用函数
    document.onclick = fn1;        //是事件调用的函数,所以event有内容
</script>

 

onmousemove : 当鼠标在一个元素上面移动的触发
触发频率不是像素,而是间隔时间,在一个指定时间内(很短),如果鼠标的位置和上一次的位置发生了变化,那么就会触发一次

 

div跟随鼠标移动demo:

window.onload = function(){
        var i = 0;
        var oDiv = document.getElementById('div1');

        document.onmousemove = function(){
            
            document.title = i++;
            var ev = ev || event;
            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

             oDiv.style.left = ev.clientX + 'px';
             oDiv.style.top = ev.clientY + scrollTop + 'px';
        };
    };

 

posted @ 2015-03-17 11:37  波克比520  阅读(247)  评论(0编辑  收藏  举报