一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法
【專利摘要】本發(fā)明提出了一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，該方法包括以下步驟：a.實(shí)時(shí)監(jiān)聽(tīng)鼠標(biāo)在分類導(dǎo)航菜單內(nèi)的移動(dòng)事件，獲取菜單的相關(guān)位置數(shù)據(jù)；b.通過(guò)鼠標(biāo)的位移量判斷鼠標(biāo)是否在線段AB下方和線段AC上方的特定區(qū)域，若在，則執(zhí)行步驟d；若不在，則執(zhí)行步驟c；c.更新數(shù)據(jù)，同步顯示鼠標(biāo)所在菜單對(duì)應(yīng)的下拉菜單，再次執(zhí)行步驟a；d.監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否有停頓，若無(wú)停頓，則執(zhí)行步驟e；若有停頓，則執(zhí)行步驟c；e.下拉菜單不變，向目標(biāo)下拉子菜單的方向快速移動(dòng)鼠標(biāo)并選擇。本發(fā)明實(shí)現(xiàn)了下拉菜單快速響應(yīng)同步顯示，消除了延遲顯示帶來(lái)的影響，提高了瀏覽效率；用戶使用時(shí)可斜著移動(dòng)鼠標(biāo)至下拉菜單且下拉菜單不消失，增強(qiáng)了用戶體驗(yàn)。
【專利說(shuō)明】一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法

【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及計(jì)算機(jī)應(yīng)用領(lǐng)域，特別涉及一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法。

【背景技術(shù)】
[0002]在計(jì)算機(jī)應(yīng)用中，對(duì)于下拉菜單，當(dāng)用戶選中一個(gè)選項(xiàng)后，該選項(xiàng)會(huì)向下延伸出具有其他選項(xiàng)的另一個(gè)菜單。下拉式菜單通常應(yīng)用于把一些具有相同分類的功能放在同一個(gè)下拉式菜單中，并把這個(gè)下拉菜單置于主菜單的選項(xiàng)下。分類導(dǎo)航的下拉菜單設(shè)計(jì)是基于下拉菜單的功能特點(diǎn)，把大量的信息逐步細(xì)分和歸類，在有限的空間內(nèi)展示給用戶更多的信息。
[0003]傳統(tǒng)的分類導(dǎo)航下拉菜單顯示下拉菜單有一定的延遲，因?yàn)槿舨贿@樣做，斜著移動(dòng)鼠標(biāo)時(shí)鼠標(biāo)事件消失，下拉菜單就會(huì)消失，對(duì)于用戶來(lái)說(shuō)一般需要先平移鼠標(biāo)到下拉菜單，然后才能在下拉菜單列表中選擇目標(biāo)子菜單。但采用延遲的方法存在一個(gè)問(wèn)題，即當(dāng)鼠標(biāo)移動(dòng)至某菜單時(shí)因?yàn)闀r(shí)間延遲其下拉菜單不能同步顯示。舉個(gè)例子，假設(shè)分類導(dǎo)航中有10個(gè)主菜單，當(dāng)鼠標(biāo)連續(xù)快速?gòu)牟藛蜪拖動(dòng)到菜單10的過(guò)程中,可能只有3到4個(gè)菜單響應(yīng)鼠標(biāo)事件顯示下拉菜單，而其他菜單則來(lái)不及響應(yīng)。
[0004]目前網(wǎng)站分類導(dǎo)航的下拉菜單被使用得非常頻繁，若下拉菜單延遲顯示，則用戶不能快速瀏覽到目標(biāo)信息，影響了用戶的使用體驗(yàn)；且用戶只能水平移動(dòng)鼠標(biāo)至下拉菜單，然后再變化方向到目標(biāo)子菜單，而不能斜著移動(dòng)鼠標(biāo)直接到目標(biāo)子菜單。


【發(fā)明內(nèi)容】

[0005]針對(duì)現(xiàn)有的分類導(dǎo)航的下拉菜單中存在的問(wèn)題，本發(fā)明提出了一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，實(shí)時(shí)監(jiān)聽(tīng)鼠標(biāo)移動(dòng)事件，獲取目標(biāo)菜單的相關(guān)數(shù)據(jù)，判斷鼠標(biāo)是否在特定區(qū)域，監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否停頓，更新數(shù)據(jù)信息或選擇目標(biāo)下拉子菜單。
[0006]為實(shí)現(xiàn)上述
【發(fā)明內(nèi)容】
，本發(fā)明采用了一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，該方法包括以下步驟:
[0007]a.實(shí)時(shí)監(jiān)聽(tīng)鼠標(biāo)在分類導(dǎo)航菜單內(nèi)的移動(dòng)事件，獲取菜單的相關(guān)位置數(shù)據(jù)，包括菜單上的鼠標(biāo)位置A (Xx，Yy)，和其下拉菜單的位置B (Mm，Nn)，C (Pp, Qq)；
[0008]b.通過(guò)鼠標(biāo)的位移量判斷鼠標(biāo)是否在線段AB下方和線段AC上方的特定區(qū)域，若在，則執(zhí)行步驟d ;若不在，則執(zhí)行步驟c ；
[0009]c.更新數(shù)據(jù)，同步顯示鼠標(biāo)所在菜單對(duì)應(yīng)的下拉菜單，再次執(zhí)行步驟a;
[0010]d.監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否有停頓，若無(wú)停頓，則執(zhí)行步驟e ;若有停頓，則執(zhí)行步驟c:
[0011]e.下拉菜單不變，向目標(biāo)下拉子菜單的方向快速移動(dòng)鼠標(biāo)并選擇。
[0012]進(jìn)一步，步驟b中獲取鼠標(biāo)位移量之后，通過(guò)比較與線段AB和線段AC斜率的方法判斷鼠標(biāo)是否在特定區(qū)域。
[0013]進(jìn)一步，所述下拉菜單的位置B、C為下拉菜單標(biāo)簽的左上角和左下角。
[0014]進(jìn)一步，所述下拉菜單的位置B、C為下拉菜單標(biāo)簽的右上角和右下角。
[0015]與現(xiàn)有技術(shù)相比，本發(fā)明實(shí)現(xiàn)了下拉菜單快速響應(yīng)同步顯示，消除了延遲顯示帶來(lái)的影響，提高了瀏覽效率；用戶使用時(shí)可斜著移動(dòng)鼠標(biāo)至下拉菜單且下拉菜單不消失，增強(qiáng)了用戶體驗(yàn)。

【專利附圖】

【附圖說(shuō)明】
[0016]圖1為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的流程圖；
[0017]圖2為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的實(shí)施例一；
[0018]圖3為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的實(shí)施例二。

【具體實(shí)施方式】
[0019]為了使本發(fā)明所提到的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法及其優(yōu)點(diǎn)更加清楚明確，以下參照附圖對(duì)本發(fā)明進(jìn)行更進(jìn)一步的詳細(xì)說(shuō)明。
[0020]圖1為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的流程圖，如圖1所示，該方法的主要流程步驟如下:
[0021]步驟1，實(shí)時(shí)監(jiān)聽(tīng)鼠標(biāo)在分類導(dǎo)航菜單內(nèi)的移動(dòng)事件，獲取菜單的相關(guān)位置數(shù)據(jù)。
[0022]相關(guān)數(shù)據(jù)包括菜單上的鼠標(biāo)位置A (Xx, Yy)，其下拉菜單的位置B (Mffl, Nn)，C (Pp, Qq)，其中下#X、y、m、n、p、q為變量，隨著鼠標(biāo)和下拉菜單的位置變化而變化。其中，下拉菜單可以是在分類導(dǎo)航菜單的右側(cè)，也可以是在分類導(dǎo)航下拉菜單的左側(cè)。
[0023]步驟2，判斷鼠標(biāo)是否在線段AB下方和線段AC上方的特定區(qū)域。
[0024]鼠標(biāo)A的位置變化后，通過(guò)比較與線段AB和線段AC斜率的方法判斷鼠標(biāo)是否在特定區(qū)域，若鼠標(biāo)在該特定區(qū)域，則接著執(zhí)行步驟4;若鼠標(biāo)不在該特定區(qū)域，則接著執(zhí)行步驟3。
[0025]步驟3，更新數(shù)據(jù)，同步顯示鼠標(biāo)所在菜單對(duì)應(yīng)的下拉菜單。
[0026]隨著鼠標(biāo)移動(dòng)，菜單響應(yīng)鼠標(biāo)移動(dòng)事件，其下拉菜單也同時(shí)變化。
[0027]步驟4，監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否有停頓。
[0028]鼠標(biāo)在特定區(qū)域移動(dòng)時(shí)，如果監(jiān)聽(tīng)到其有停頓，則菜單響應(yīng)鼠標(biāo)事件，執(zhí)行步驟3，更新數(shù)據(jù)，顯示新的下拉菜單；如果沒(méi)有停頓，則下拉菜單不變，執(zhí)行步驟5。停頓的響應(yīng)時(shí)間根據(jù)用戶需求預(yù)先設(shè)置。
[0029]步驟5，下拉菜單不變，向目標(biāo)下拉子菜單方向快速移動(dòng)鼠標(biāo)并選擇。
[0030]鼠標(biāo)可以直接斜向移動(dòng)至目標(biāo)下拉子菜單且此時(shí)菜單不響應(yīng)鼠標(biāo)移動(dòng)事件，無(wú)需先水平方向移動(dòng)和設(shè)置下拉菜單延遲顯示。
[0031]進(jìn)一步，目標(biāo)菜單變化，下拉菜單也同步變化，重新執(zhí)行本發(fā)明方法。
[0032]圖2為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的實(shí)施例一，如圖
2所示，左側(cè)為分類導(dǎo)航菜單:菜單1、菜單2、菜單3、菜單4.....菜單n-1，菜單η ;右側(cè)顯示為菜單對(duì)應(yīng)的下拉菜單，在圖2中鼠標(biāo)移動(dòng)到菜單2，故為菜單2的下拉菜單:下拉21、下拉22、下拉23、下拉24.....下拉2m-l，下拉m，當(dāng)前目標(biāo)下拉菜單為下拉2m_l。
[0033]該實(shí)施過(guò)程如下:
[0034]監(jiān)聽(tīng)到鼠標(biāo)移動(dòng)到菜單2，獲取鼠標(biāo)的位置A(Xx，Yy)和菜單2的下拉菜單位置B(Mm, Nn), C(Pp, Qq), Mm = Pp ;計(jì)算鼠標(biāo)的位移量:如果鼠標(biāo)移動(dòng)后的新位置為黑色圓點(diǎn)A1 (Xx1, Yy1)，其中 Mm > Xx1 > Xx, Qq < Yy1 < Yy,鼠標(biāo)位置變化量為 ΛΧ = Xx1-Xx, ΔΥ =Yy1-Yy, A1相對(duì)于A的斜率變化為k = Λ Y/ Λ X。線段AB的斜率Ic1 = (Nn-Yy) / (Mm-Xx) > O，線段AC的斜率k2 = (Qq-Yy) / (Pp-Xx) < O，通過(guò)比較斜率可以判斷出A1在線段AB下方和線段AC上方的特定區(qū)域；進(jìn)一步，監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否停頓，若未停頓，則下拉菜單不變，此時(shí)菜單3不響應(yīng)鼠標(biāo)事件，鼠標(biāo)可以直接斜向移動(dòng)至目標(biāo)下拉菜單下拉2m-l ;如果鼠標(biāo)移動(dòng)過(guò)程出現(xiàn)停頓，菜單3立即響應(yīng)鼠標(biāo)事件，此時(shí)下拉菜單變?yōu)椴藛?的下拉菜單。
[0035]如果鼠標(biāo)移動(dòng)后的新位置為黑色圓點(diǎn)A2(Xx2，Yy2)，其中Xx2 < Xx, Qq < Yy2 < Yy,鼠標(biāo)位置變化量為λ X = Xx2-Xx, λ Y = Yy2-Yy, A2相對(duì)于A的斜率變化為k = Λ Y/ Λ X。線段 AB 的斜率 Ic1 = (Nn-Yy) / (Mm-Xx) > O,線段 AC 的斜率 k2 = (Qq-Yy) / (Pp-Xx) < O,通過(guò)比較斜率可以判斷出A2不在線段AB下方和線段AC上方的特定區(qū)域；數(shù)據(jù)更新，菜單4立即響應(yīng)鼠標(biāo)事件，此時(shí)下拉菜單變?yōu)椴藛?的下拉菜單，接著再次執(zhí)行本發(fā)明方法。
[0036]圖3為本發(fā)明所提供的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法的實(shí)施例二，如圖
3所示，右側(cè)為分類導(dǎo)航菜單:菜單1、菜單2、菜單3、菜單4.....菜單n-1，菜單η ;左側(cè)顯示為菜單對(duì)應(yīng)的下拉菜單，在圖3中鼠標(biāo)移動(dòng)到菜單η-1，故為菜單η-1的下拉菜單:下拉(n-1) 1、下拉(n-1) 2、下拉(n_l)3、下拉(n_l) 4、...、下拉(n-l)m-l,下拉(n_l)m,當(dāng)前目標(biāo)下拉菜單為下拉(n-1) 3。
[0037]該實(shí)施過(guò)程如下:
[0038]監(jiān)聽(tīng)到鼠標(biāo)移動(dòng)到菜單n-1，獲取鼠標(biāo)的位置A(Xx，Yy)和菜單n_l的下拉菜單位置B(Mm，Nn)，C(Pp, Qq), Mffl = Pp ;計(jì)算鼠標(biāo)的位移量:如果鼠標(biāo)移動(dòng)后的新位置為黑色圓點(diǎn)A/ (Xx1, Yy1)，其中 Mm < Xx1 < Xx, Yy < Yy1 < Nn,鼠標(biāo)位置變化量為 ΔΧ = Xx1-Xx, Λ Y=Yy1-Yy, A1'相對(duì)于A的斜率變化為k = Λ Y/ Λ X。線段AB的斜率ki = (Nn-Yy) / (Mm-Xx)
<0，線段AC的斜率k2 = (Qq-Yy)/(Pp-Xx) > 0，通過(guò)比較斜率可以判斷出Al'在線段AB下方和線段AC上方的特定區(qū)域；進(jìn)一步，監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否停頓，若未停頓，則下拉菜單不變，此時(shí)菜單4不響應(yīng)鼠標(biāo)事件，鼠標(biāo)可以直接斜向移動(dòng)至目標(biāo)下拉菜單下拉(n-l)3 ；如果鼠標(biāo)移動(dòng)過(guò)程出現(xiàn)停頓，菜單4立即響應(yīng)鼠標(biāo)事件，此時(shí)下拉菜單變?yōu)椴藛?的下拉菜單。
[0039]如果鼠標(biāo)移動(dòng)后的新位置為黑色圓點(diǎn)A2' (Xx2，Yy2)，其中Mm < Xx2 < Xx,Yy < Yy2
<Nn,鼠標(biāo)位置變化量為ΛΧ = Xx2-Xx, Λ Y = Yy2-Yy, A2'相對(duì)于A的斜率變化為k = Λ Y/Λ X。線段 AB 的斜率 Ic1 = (Nn-Yy) / (Mm-Xx) < 0，線段 AC 的斜率 k2 = (QrYy) / (Pp-Xx) > 0，通過(guò)比較斜率可以判斷出A2'不在線段AB下方和線段AC上方的特定區(qū)域；數(shù)據(jù)更新，菜單3立即響應(yīng)鼠標(biāo)事件，此時(shí)下拉菜單變?yōu)椴藛?的下拉菜單，接著再次執(zhí)行本發(fā)明方法。
[0040]以上所述是對(duì)本發(fā)明的較佳的【具體實(shí)施方式】，本【技術(shù)領(lǐng)域】人員應(yīng)當(dāng)理解，所述實(shí)施方式并非限定本發(fā)明的保護(hù)范圍。在不脫離本發(fā)明的精神實(shí)質(zhì)和原則下，在細(xì)節(jié)方面可以進(jìn)行變化或者修改，均應(yīng)涵蓋在本發(fā)明的權(quán)利要求范圍之內(nèi)。
【權(quán)利要求】
1.一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，其特征在于，該方法包括以下步驟: a.實(shí)時(shí)監(jiān)聽(tīng)鼠標(biāo)在分類導(dǎo)航菜單內(nèi)的移動(dòng)事件，獲取菜單的相關(guān)位置數(shù)據(jù)，包括菜單上的鼠標(biāo)位置A (Xx, Yy)，和其下拉菜單的位置B (Mffl, Nn)，C (Pp, Qq)； b.通過(guò)鼠標(biāo)的位移量判斷鼠標(biāo)是否在線段AB下方和線段AC上方的特定區(qū)域，若在，則執(zhí)行步驟d ;若不在，則執(zhí)行步驟c ； c.更新數(shù)據(jù)，同步顯示鼠標(biāo)所在菜單對(duì)應(yīng)的下拉菜單，再次執(zhí)行步驟a；d.監(jiān)聽(tīng)鼠標(biāo)移動(dòng)過(guò)程是否有停頓，若無(wú)停頓，則執(zhí)行步驟e;若有停頓，則執(zhí)行步驟c ; e.下拉菜單不變，向目標(biāo)下拉子菜單的方向快速移動(dòng)鼠標(biāo)并選擇。
2.如權(quán)利要求1所述的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，步驟b中獲取鼠標(biāo)位移量之后，通過(guò)比較與線段AB和線段AC斜率的方法判斷鼠標(biāo)是否在特定區(qū)域。
3.如權(quán)利要求1所述的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，所述下拉子菜單的位置B、C為下拉子菜單標(biāo)簽的左上角和左下角。
4.如權(quán)利要求1所述的一種分類導(dǎo)航的下拉菜單設(shè)計(jì)實(shí)現(xiàn)方法，所述下拉子菜單的位置B、C為下拉子菜單標(biāo)簽的右上角和右下角。
【文檔編號(hào)】G06F9/44GK104077115SQ201310099005
【公開(kāi)日】2014年10月1日 申請(qǐng)日期:2013年3月27日 優(yōu)先權(quán)日:2013年3月27日
【發(fā)明者】牟春林 申請(qǐng)人:蘇州精易會(huì)信息技術(shù)有限公司