一種分類導航的下拉菜單設計實現方法
【專利摘要】本發(fā)明提出了一種分類導航的下拉菜單設計實現方法,該方法包括以下步驟:a.實時監(jiān)聽鼠標在分類導航菜單內的移動事件,獲取菜單的相關位置數據;b.通過鼠標的位移量判斷鼠標是否在線段AB下方和線段AC上方的特定區(qū)域,若在,則執(zhí)行步驟d;若不在,則執(zhí)行步驟c;c.更新數據,同步顯示鼠標所在菜單對應的下拉菜單,再次執(zhí)行步驟a;d.監(jiān)聽鼠標移動過程是否有停頓,若無停頓,則執(zhí)行步驟e;若有停頓,則執(zhí)行步驟c;e.下拉菜單不變,向目標下拉子菜單的方向快速移動鼠標并選擇。本發(fā)明實現了下拉菜單快速響應同步顯示,消除了延遲顯示帶來的影響,提高了瀏覽效率;用戶使用時可斜著移動鼠標至下拉菜單且下拉菜單不消失,增強了用戶體驗。
【專利說明】一種分類導航的下拉菜單設計實現方法
【技術領域】
[0001]本發(fā)明涉及計算機應用領域,特別涉及一種分類導航的下拉菜單設計實現方法。
【背景技術】
[0002]在計算機應用中,對于下拉菜單,當用戶選中一個選項后,該選項會向下延伸出具有其他選項的另一個菜單。下拉式菜單通常應用于把一些具有相同分類的功能放在同一個下拉式菜單中,并把這個下拉菜單置于主菜單的選項下。分類導航的下拉菜單設計是基于下拉菜單的功能特點,把大量的信息逐步細分和歸類,在有限的空間內展示給用戶更多的信息。
[0003]傳統(tǒng)的分類導航下拉菜單顯示下拉菜單有一定的延遲,因為若不這樣做,斜著移動鼠標時鼠標事件消失,下拉菜單就會消失,對于用戶來說一般需要先平移鼠標到下拉菜單,然后才能在下拉菜單列表中選擇目標子菜單。但采用延遲的方法存在一個問題,即當鼠標移動至某菜單時因為時間延遲其下拉菜單不能同步顯示。舉個例子,假設分類導航中有10個主菜單,當鼠標連續(xù)快速從菜單I拖動到菜單10的過程中,可能只有3到4個菜單響應鼠標事件顯示下拉菜單,而其他菜單則來不及響應。
[0004]目前網站分類導航的下拉菜單被使用得非常頻繁,若下拉菜單延遲顯示,則用戶不能快速瀏覽到目標信息,影響了用戶的使用體驗;且用戶只能水平移動鼠標至下拉菜單,然后再變化方向到目標子菜單,而不能斜著移動鼠標直接到目標子菜單。
【發(fā)明內容】
[0005]針對現有的分類導航的下拉菜單中存在的問題,本發(fā)明提出了一種分類導航的下拉菜單設計實現方法,實時監(jiān)聽鼠標移動事件,獲取目標菜單的相關數據,判斷鼠標是否在特定區(qū)域,監(jiān)聽鼠標移動過程是否停頓,更新數據信息或選擇目標下拉子菜單。
[0006]為實現上述
【發(fā)明內容】
,本發(fā)明采用了一種分類導航的下拉菜單設計實現方法,該方法包括以下步驟:
[0007]a.實時監(jiān)聽鼠標在分類導航菜單內的移動事件,獲取菜單的相關位置數據,包括菜單上的鼠標位置A (Xx,Yy),和其下拉菜單的位置B (Mm,Nn),C (Pp, Qq);
[0008]b.通過鼠標的位移量判斷鼠標是否在線段AB下方和線段AC上方的特定區(qū)域,若在,則執(zhí)行步驟d ;若不在,則執(zhí)行步驟c ;
[0009]c.更新數據,同步顯示鼠標所在菜單對應的下拉菜單,再次執(zhí)行步驟a;
[0010]d.監(jiān)聽鼠標移動過程是否有停頓,若無停頓,則執(zhí)行步驟e ;若有停頓,則執(zhí)行步驟c:
[0011]e.下拉菜單不變,向目標下拉子菜單的方向快速移動鼠標并選擇。
[0012]進一步,步驟b中獲取鼠標位移量之后,通過比較與線段AB和線段AC斜率的方法判斷鼠標是否在特定區(qū)域。
[0013]進一步,所述下拉菜單的位置B、C為下拉菜單標簽的左上角和左下角。
[0014]進一步,所述下拉菜單的位置B、C為下拉菜單標簽的右上角和右下角。
[0015]與現有技術相比,本發(fā)明實現了下拉菜單快速響應同步顯示,消除了延遲顯示帶來的影響,提高了瀏覽效率;用戶使用時可斜著移動鼠標至下拉菜單且下拉菜單不消失,增強了用戶體驗。
【專利附圖】
【附圖說明】
[0016]圖1為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的流程圖;
[0017]圖2為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的實施例一;
[0018]圖3為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的實施例二。
【具體實施方式】
[0019]為了使本發(fā)明所提到的一種分類導航的下拉菜單設計實現方法及其優(yōu)點更加清楚明確,以下參照附圖對本發(fā)明進行更進一步的詳細說明。
[0020]圖1為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的流程圖,如圖1所示,該方法的主要流程步驟如下:
[0021]步驟1,實時監(jiān)聽鼠標在分類導航菜單內的移動事件,獲取菜單的相關位置數據。
[0022]相關數據包括菜單上的鼠標位置A (Xx, Yy),其下拉菜單的位置B (Mffl, Nn),C (Pp, Qq),其中下#X、y、m、n、p、q為變量,隨著鼠標和下拉菜單的位置變化而變化。其中,下拉菜單可以是在分類導航菜單的右側,也可以是在分類導航下拉菜單的左側。
[0023]步驟2,判斷鼠標是否在線段AB下方和線段AC上方的特定區(qū)域。
[0024]鼠標A的位置變化后,通過比較與線段AB和線段AC斜率的方法判斷鼠標是否在特定區(qū)域,若鼠標在該特定區(qū)域,則接著執(zhí)行步驟4;若鼠標不在該特定區(qū)域,則接著執(zhí)行步驟3。
[0025]步驟3,更新數據,同步顯示鼠標所在菜單對應的下拉菜單。
[0026]隨著鼠標移動,菜單響應鼠標移動事件,其下拉菜單也同時變化。
[0027]步驟4,監(jiān)聽鼠標移動過程是否有停頓。
[0028]鼠標在特定區(qū)域移動時,如果監(jiān)聽到其有停頓,則菜單響應鼠標事件,執(zhí)行步驟3,更新數據,顯示新的下拉菜單;如果沒有停頓,則下拉菜單不變,執(zhí)行步驟5。停頓的響應時間根據用戶需求預先設置。
[0029]步驟5,下拉菜單不變,向目標下拉子菜單方向快速移動鼠標并選擇。
[0030]鼠標可以直接斜向移動至目標下拉子菜單且此時菜單不響應鼠標移動事件,無需先水平方向移動和設置下拉菜單延遲顯示。
[0031]進一步,目標菜單變化,下拉菜單也同步變化,重新執(zhí)行本發(fā)明方法。
[0032]圖2為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的實施例一,如圖
2所示,左側為分類導航菜單:菜單1、菜單2、菜單3、菜單4.....菜單n-1,菜單η ;右側顯示為菜單對應的下拉菜單,在圖2中鼠標移動到菜單2,故為菜單2的下拉菜單:下拉21、下拉22、下拉23、下拉24.....下拉2m-l,下拉m,當前目標下拉菜單為下拉2m_l。
[0033]該實施過程如下:
[0034]監(jiān)聽到鼠標移動到菜單2,獲取鼠標的位置A(Xx,Yy)和菜單2的下拉菜單位置B(Mm, Nn), C(Pp, Qq), Mm = Pp ;計算鼠標的位移量:如果鼠標移動后的新位置為黑色圓點A1 (Xx1, Yy1),其中 Mm > Xx1 > Xx, Qq < Yy1 < Yy,鼠標位置變化量為 ΛΧ = Xx1-Xx, ΔΥ =Yy1-Yy, A1相對于A的斜率變化為k = Λ Y/ Λ X。線段AB的斜率Ic1 = (Nn-Yy) / (Mm-Xx) > O,線段AC的斜率k2 = (Qq-Yy) / (Pp-Xx) < O,通過比較斜率可以判斷出A1在線段AB下方和線段AC上方的特定區(qū)域;進一步,監(jiān)聽鼠標移動過程是否停頓,若未停頓,則下拉菜單不變,此時菜單3不響應鼠標事件,鼠標可以直接斜向移動至目標下拉菜單下拉2m-l ;如果鼠標移動過程出現停頓,菜單3立即響應鼠標事件,此時下拉菜單變?yōu)椴藛?的下拉菜單。
[0035]如果鼠標移動后的新位置為黑色圓點A2(Xx2,Yy2),其中Xx2 < Xx, Qq < Yy2 < Yy,鼠標位置變化量為λ X = Xx2-Xx, λ Y = Yy2-Yy, A2相對于A的斜率變化為k = Λ Y/ Λ X。線段 AB 的斜率 Ic1 = (Nn-Yy) / (Mm-Xx) > O,線段 AC 的斜率 k2 = (Qq-Yy) / (Pp-Xx) < O,通過比較斜率可以判斷出A2不在線段AB下方和線段AC上方的特定區(qū)域;數據更新,菜單4立即響應鼠標事件,此時下拉菜單變?yōu)椴藛?的下拉菜單,接著再次執(zhí)行本發(fā)明方法。
[0036]圖3為本發(fā)明所提供的一種分類導航的下拉菜單設計實現方法的實施例二,如圖
3所示,右側為分類導航菜單:菜單1、菜單2、菜單3、菜單4.....菜單n-1,菜單η ;左側顯示為菜單對應的下拉菜單,在圖3中鼠標移動到菜單η-1,故為菜單η-1的下拉菜單:下拉(n-1) 1、下拉(n-1) 2、下拉(n_l)3、下拉(n_l) 4、...、下拉(n-l)m-l,下拉(n_l)m,當前目標下拉菜單為下拉(n-1) 3。
[0037]該實施過程如下:
[0038]監(jiān)聽到鼠標移動到菜單n-1,獲取鼠標的位置A(Xx,Yy)和菜單n_l的下拉菜單位置B(Mm,Nn),C(Pp, Qq), Mffl = Pp ;計算鼠標的位移量:如果鼠標移動后的新位置為黑色圓點A/ (Xx1, Yy1),其中 Mm < Xx1 < Xx, Yy < Yy1 < Nn,鼠標位置變化量為 ΔΧ = Xx1-Xx, Λ Y=Yy1-Yy, A1'相對于A的斜率變化為k = Λ Y/ Λ X。線段AB的斜率ki = (Nn-Yy) / (Mm-Xx)
<0,線段AC的斜率k2 = (Qq-Yy)/(Pp-Xx) > 0,通過比較斜率可以判斷出Al'在線段AB下方和線段AC上方的特定區(qū)域;進一步,監(jiān)聽鼠標移動過程是否停頓,若未停頓,則下拉菜單不變,此時菜單4不響應鼠標事件,鼠標可以直接斜向移動至目標下拉菜單下拉(n-l)3 ;如果鼠標移動過程出現停頓,菜單4立即響應鼠標事件,此時下拉菜單變?yōu)椴藛?的下拉菜單。
[0039]如果鼠標移動后的新位置為黑色圓點A2' (Xx2,Yy2),其中Mm < Xx2 < Xx,Yy < Yy2
<Nn,鼠標位置變化量為ΛΧ = Xx2-Xx, Λ Y = Yy2-Yy, A2'相對于A的斜率變化為k = Λ Y/Λ X。線段 AB 的斜率 Ic1 = (Nn-Yy) / (Mm-Xx) < 0,線段 AC 的斜率 k2 = (QrYy) / (Pp-Xx) > 0,通過比較斜率可以判斷出A2'不在線段AB下方和線段AC上方的特定區(qū)域;數據更新,菜單3立即響應鼠標事件,此時下拉菜單變?yōu)椴藛?的下拉菜單,接著再次執(zhí)行本發(fā)明方法。
[0040]以上所述是對本發(fā)明的較佳的【具體實施方式】,本【技術領域】人員應當理解,所述實施方式并非限定本發(fā)明的保護范圍。在不脫離本發(fā)明的精神實質和原則下,在細節(jié)方面可以進行變化或者修改,均應涵蓋在本發(fā)明的權利要求范圍之內。
【權利要求】
1.一種分類導航的下拉菜單設計實現方法,其特征在于,該方法包括以下步驟: a.實時監(jiān)聽鼠標在分類導航菜單內的移動事件,獲取菜單的相關位置數據,包括菜單上的鼠標位置A (Xx, Yy),和其下拉菜單的位置B (Mffl, Nn),C (Pp, Qq); b.通過鼠標的位移量判斷鼠標是否在線段AB下方和線段AC上方的特定區(qū)域,若在,則執(zhí)行步驟d ;若不在,則執(zhí)行步驟c ; c.更新數據,同步顯示鼠標所在菜單對應的下拉菜單,再次執(zhí)行步驟a;d.監(jiān)聽鼠標移動過程是否有停頓,若無停頓,則執(zhí)行步驟e;若有停頓,則執(zhí)行步驟c ; e.下拉菜單不變,向目標下拉子菜單的方向快速移動鼠標并選擇。
2.如權利要求1所述的一種分類導航的下拉菜單設計實現方法,步驟b中獲取鼠標位移量之后,通過比較與線段AB和線段AC斜率的方法判斷鼠標是否在特定區(qū)域。
3.如權利要求1所述的一種分類導航的下拉菜單設計實現方法,所述下拉子菜單的位置B、C為下拉子菜單標簽的左上角和左下角。
4.如權利要求1所述的一種分類導航的下拉菜單設計實現方法,所述下拉子菜單的位置B、C為下拉子菜單標簽的右上角和右下角。
【文檔編號】G06F9/44GK104077115SQ201310099005
【公開日】2014年10月1日 申請日期:2013年3月27日 優(yōu)先權日:2013年3月27日
【發(fā)明者】牟春林 申請人:蘇州精易會信息技術有限公司