jquery實現聊天視窗拖動

2022-02-17 09:10:49 字數 531 閱讀 3392

實現:滑鼠的點選按下事件+滑鼠的移動事件+滑鼠點選鬆開事件

思路:# mousedown事件

當滑鼠點選聊天視窗,點選事件可以得到當前的滑鼠的點選位置並記錄下來,並得到當前視窗的左和上的偏移位置,還需要新增乙個滑鼠點選該聊天視窗的標誌位。

# $(document).mousemove事件

滑鼠移動,觸發mousemove事件,先去判斷該聊天視窗是否是點選狀態,實時獲取當前滑鼠的位置,以之前滑鼠點選位置減去當前滑鼠的位置,得到聊天視窗要偏移的x和y軸畫素值,再以之前記錄的聊天框左和上偏移位置去相加得出的x和y,給聊天視窗重新賦值左和上的偏移畫素值。

# mouseup事件

滑鼠點選鬆開,該聊天視窗的標誌位至為false,滑鼠移動就操作不到聊天框了。

注:通過e.clientx和e.clienty都可以獲得滑鼠的位置,是瀏覽器對聊天視窗的位置(超過一螢幕的內容拖動會有問題)

效果圖:

ListView的使用 聊天視窗

一 步驟 1 在layout建立兩個布局,分別是自己的回答條,和對方的回答條。2 建立chatmessage這個類,成員變數有頭像位址 聊天內容 所屬型別 假設1表示對方,2表示自己 3 建立chatbaseadapter,故名思意繼承baseadapter。就主要展示下getview 方法 pri...

簡易聊天程式教程(六)主視窗和聊天視窗

主視窗用的是jlist控制項,在顯示了登陸的跟人資訊之後,接下來就是好友的列表。為了方便以後拓展 我把好友的資訊封裝在friendinformation中,friendinformation類的定義也很簡單的,都能看懂。下面來逐步分析一下mainwin類 mainwin中比較重要的是事件的監聽 好友...

設計聊天視窗的測試用例

網路正常狀態下,單聊的情境下 是否支援傳送檔案 群聊檔案 是否支援將語音轉化為文字 訊息傳送失敗,是否支援重發?訊息傳送後,是否支援撤回,在設定的時間內,是否能撤回?超出時間不能撤回?未加好友狀態下,是否能傳送訊息?提示的對方還不是你的好友時,是否支援加好友功能?加好友後,傳送訊息是否正常?連續發訊...