-
B在鼠标事件发生的时候,从 Event.pageX 获得鼠标的x 坐标位置查看全部
-
鼠标拖拽事件三个关键: var mouseOffsetX = 0; // 偏移 var mouseOffsetY = 0; var isDraging = false; // 是否可拖拽的标记 (1)在标题栏上按下。鼠标在标题栏上按下时,要计算鼠标相对拖拽元素的左上角的坐标,并且标记元素为可拖动。 g('dialogTitle').addEventListener('mousedown',function(e){ var e = e || window.event; mouseOffsetX = e.pageX - g('dialog').offsetLeft; mouseOffsetY = e.pageY - g('dialog').offsetTop; isDraging = true; }) (2)开始移动。鼠标开始移动,要检测登录浮层是否可标记为移动,如果是,则更新元素的位置到当前鼠标的位置(注意:要减去第一步中获得的偏移) document.onmousemove = function( e ){ var e = e || window.event; var mouseX = e.pageX; // 鼠标当前的位置 var mouseY = e.pageY; var moveX = 0; // 浮层元素的新位置 var moveY = 0; if( isDraging === true ){ moveX = mouseX - mouseOffsetX moveY = mouseY - mouseOffsetY; g('dialog').style.left = moveX + 'px'; g('dialog').style.top = moveY + 'px'; } } (3)放开。鼠标松开的时候,标记元素为不可拖动状态即可。 document.onmouseup = function(){ isDraging = false; }查看全部
-
遮罩全屏及自动居中浮层: <div class="link"> <a href="javascript:showDialog();">登录</a> </div> <div class="ui-mask" id="mask" onselectstart="return false"></div> js: // 获取元素对象 function g(id){return document.getElementById(id);} // 自动居中元素(el = Element) function autoCenter( el ){ var bodyW = document.documentElement.clientWidth; var bodyH = document.documentElement.clientHeight; var elW = el.offsetWidth; var elH = el.offsetHeight; el.style.left = (bodyW-elW)/2 + 'px'; el.style.top = (bodyH-elH)/2 + 'px'; } // 自动扩展元素到全部显示区域 function fillToBody( el ){ el.style.width = document.documentElement.clientWidth +'px'; el.style.height = document.documentElement.clientHeight + 'px'; }查看全部
-
获得窗口显示区域的宽度的方法是document.documentElement.clientWidth查看全部
-
防止鼠标选中:onselectstart="return false" 设置透明度:opacity:0.4;filter: Alpha(opacity=40);查看全部
举报
0/150
提交
取消