拖拽:
事件: onmousedown onmousemove onmouseup
1.首先需要为拖拽的对象添加一个onmousedown事件
记录: 鼠标点击某个对象的内部偏移量
var disc=e,offsetX || e.layerX(火狐使用
var disc=e.offsetY || e.layerY(火狐使用
2.鼠标在文档上移动:
要想让操作的元素动起来,该元素必须有定位
移动的过程,实际上改变的是元素的left和top值
3.停止移动,需要触发onmouseup事件
鼠标抬起时,取消移动document.onmousemove=null;
拖拽时去掉文字内容选中兼容
window.getSelection ? window.getSelection( ).removeAllRanges( ):document.selection.empty( );
ie: document.selection.empty( );
高版本浏览器:window.getSelection( ).removeAllRanges( );
scroll家族属性
scrollTop :页面垂直方向滚走的距离
scrollLeft : 页面水平方向滚走的距离
window.onscroll事件
window.onscroll = function( ) { document.documentElement.scrollTop || document.body.scrollTop (兼容没有<!DOCTYPE html>声明的页面) } document.documentElement.scrollTop=document.body.scrollTop=300 ; 可读写;
offset家族属性
offsetWidth 包含边框和内边距
clientWidth 不包含边框 包含内边距
offsetHeight
clientHeight
offsetLeft 相对定位时为父元素左边距离
offsetTop
导航固定顶部函数scrooll
在窗口的滚动条事件. window.scroll=function{ var stop=document.documentElement.scrolltop || doucumen.body.scrolltop; if(stop>190){ nav.style.position="fixed"; nav.style.top=0; else{nav.style.position=static;} } }