課程
/前端開發
/JavaScript
/可調大小面板實現(Resizeable Panel)
鼠標當前x軸 減去 鼠標在控制元素上x軸的偏移 這樣為什么就是控制元素的Left了?這到底是怎么算的啊?求大神解決?
2016-11-26
源自:可調大小面板實現(Resizeable Panel) 2-6
正在回答
我幫你畫了個圖 你看,只要明白這個原理,就是剩下函數的不同寫法罷了
爪哇一只貓 提問者
本來畫了2張 結果第一張沒保存住 算了 合在一起了 ?原理就是那樣
鼠標點擊要干的事:disX = e.clientX - box.offsetLeft;?
????????????????????????????? ?disY = e.clentY - box.offsetTop; ?
????????????????????????????????記錄圖2黃色部分的那個偏移量
鼠標移動要干的事: box.style.lft = e.clientX - disX + 'px'; ? ?
? ??????????????????????? ? ?box.style.top = e.clientY - box.offsetTop; ?
????????????????????????????讓鼠標當前的位置 減去那個第一次點擊后的偏移量。
鼠標抬起要干的事:讓移動和抬起時間同時=null;?
????????????????????????????????讓盒子位置固定??;
舉報
前端UI組件倉庫必備,先從分析實現原理到步驟分解,走完全過程
1 回答計算鼠標按在控制元素上的x軸偏移 是什么意思啊 大神幫幫忙 就卡在這個計算的問題上了
4 回答為什么將控制元素的Left和top設置為空,bug就沒有了呢?
1 回答為什么在設置Panel的寬度的時加上10px控制元素就不會動了?
1 回答怎么禁止className為title的那個元素的復制文本的功能
1 回答為什么要給父元素relative?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-12-08
我幫你畫了個圖 你看,只要明白這個原理,就是剩下函數的不同寫法罷了
2016-12-08
本來畫了2張 結果第一張沒保存住 算了 合在一起了 ?原理就是那樣
鼠標點擊要干的事:disX = e.clientX - box.offsetLeft;?
????????????????????????????? ?disY = e.clentY - box.offsetTop; ?
????????????????????????????????記錄圖2黃色部分的那個偏移量
鼠標移動要干的事: box.style.lft = e.clientX - disX + 'px'; ? ?
? ??????????????????????? ? ?box.style.top = e.clientY - box.offsetTop; ?
????????????????????????????讓鼠標當前的位置 減去那個第一次點擊后的偏移量。
鼠標抬起要干的事:讓移動和抬起時間同時=null;?
????????????????????????????????讓盒子位置固定??;