WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Navigation

Path Style Menu

— 添加到WorldWideScripts.net

訂閱我們的飼料,以保持最新

新!跟隨我們,你想要它


Path Style Menu - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

路徑風格的菜單

這是靈感的路徑有天空飆升在App Store上的應用程序的路徑,證明了一個獨特的UI真的可以讓你在與同類產品競爭激烈的市場邊緣2.0 UI多級菜單。

當用戶按下或點擊按鈕,菜單項擴大和把自己周圍的主按鈕形成一個弧形,圓形,水平或垂直對齊。 要關閉用戶需要選擇要么呈現一個選項菜單或再次按下主按鈕。

如果有多個級別嵌套,然後單擊子菜單會產生後退按鈕允許用戶返回上一級菜單選擇。




更新日誌如下

  • 29/05/2013變更集3.7
  • 修正了在iOS上,其中滾動頁面時菜單是跳動的弧線風格的菜單。 現在它順利頁面一起滾動。
  • 固定直列菜單錯誤:如果滾動條存在於網頁中的菜單項調整得到了扭曲。
  • 增加了一個新選項,允許在文檔窗口中點擊時崩潰停止擴展菜單。
  • 菜單項可以看到從朝向主按鈕位於其中屏幕的頂部邊緣行進。 這已得到修復。 現在在頁面加載所有你看到的是mainbutton。 項目按鈕擴大並僅在按下主按鈕後是可見的。
  • 2013年9月1日變更集3.6
  • 設置圖標尺寸和通過JavaScript一些其他屬性時,縮小的版本沒有工作。 現在,這是固定的
  • 在Firefox中,擴展菜單時出現了一個閃爍,而這個固定之前保存在以後的版本蠕動起來,這時候一勞永逸固定它!
  • 主按鈕現在默認旋轉的全360deg VS從早期版本的180deg
  • 26/11/2012變更集3.5
  • 固定在那裡的內嵌菜單沒有顯示在所有觸摸設備的問題。 在以前的版本的變化打破了這個,現在固定的。
  • 固定的子菜單項的定位時,有在所有1或2子菜單項。 菜單項將通過主按鈕保持部分覆蓋。
  • 確保該菜單沒有得到由事故隱患,即您最終創造響應式設計佈局和hidding它時,選擇在你的CSS菜單。 注意幾個主題這樣做,不應該是一個問題了。
  • 19/11/2012變更集3.4
  • 點擊按鈕將現在允許為動畫足夠的時間來導航到目的地之前網址完成
  • 當菜單加載第一次,你看到它在運動,因為它隱藏主按鈕的後面。 這是無意的。 現在,它只是加載主鍵時期的後面。
  • 在文檔中固定的不一致。
  • 22/10/2012變更集3.3
  • PDF格式文檔的新
  • 增加了設置項目時直接設置URL支持。 無需編寫任何代碼用於導航,只要您所提供的,導航是自動的。 這使得設置導航很容易,也不需要手動訂閱事件如果想僅提供導航。
  • 增加了在新標籤中打開網址的支持,默認為false。
  • 除去在CSS設置圖標URL的要求。 現在,您可以設置整個菜單的JavaScript或像以前做的事情。 你必須看看在新的文檔。
  • 早期版本的暴露而解僱任何按鈕,點擊單個onSelecteditem。 這是一個混亂的原因,你則必須手動篩選感興趣的按鈕。 為了清楚的緣故,我們現在暴露獨立事件,而不是:
    1. 單擊主按鈕時onMainButtonClick,火災
    2. onParentButtonClick-火災時,父項被點擊
    3. 單擊後退按鈕時onBackButtonClick,火災
    4. onItemButtonClick-火災菜單項按鈕
  • 修正了菜單的頁面加載自動擴展不一致。
  • 改變了的id是由組件輸出。 這一變化打破這個版本的向後兼容性。 使用CSS樣式的按鈕,這也是在以前的版本中默認的人,會想以前,即如果他們有這個前綴與菜單按鈕標識菜單ID:
     #menuitem0 { 背景:網址('../圖像/ photo.png')不重複; } #menuitem1 { 背景:網址('../圖像/ people.png')不重複; } 
    現在它:
     #menu1_menuitem0 { 背景:網址('../圖像/ photo.png')不重複; } #menu1_menuitem1 { 背景:網址('../圖像/ people.png')不重複; } 
    其中,MENU1是你的菜單的ID。
  • 容器元件現在具有默認尺寸即主按鈕的大小。 以前我們留在用戶的這種責任,但這增加了混亂和更多的手動步驟更廣闊的空間,使內嵌菜單中就像是一個希望它。 現在,這是通過菜單來處理內部。
  • 10/01/2012變更集3.2
  1. enableUrlHash現在默認為false。 要使用此功能,你必須手動將其設置為true,如{enableUrlHash:真正}傳遞作為一個選項菜單構造函數。
  2. 當通過一組簡單的字符串值項物業如的:{項目:“菜單1”,“菜單2”,“菜單3'}相較於更豐富的形式,傳遞給onSelectedItem事件處理程序的價值參數止跌回升空。 現在,這是固定的。
  3. 當一個菜單項被激活(即點擊)它折疊菜單項都在一起,點擊進入該文件再次擴大與點擊的元素沒有顯示菜單。 菜單展開時不應也不應點擊的元素是隱藏的。 這是一個錯誤,由於通過不透明性被隱藏點擊的元素。 它現在是固定的。
  4. 新增默認margin和padding的主按鈕。 這是為了確保在頁面第三方的CSS不影響菜單。
  5. 增加了對網頁載入時自動打開菜單支持。 為了使這一點,你必須設置的擴展:真
  6. 增加了自動折疊菜單後,它會自動在頁面加載的擴展支持。 為此,必須將expandTimeout值設置為等待的毫秒數。
  7. 增加了對標籤的支持。 您可以通過添加showLabel啟用此功能:真的,一個標籤顯示旁邊的圖標。 標籤文本通過title屬性提供。
  • 2012年8月15日變更集3.1
  • - 此更新可解決大部分任何IE8和IE7的問題。 修復程序列表:
  • IE7和IE8的兼容性修正:
    • 文檔中點擊和元件是處於膨脹狀態時,它們並沒有獲得折疊。 現在,這是固定的。
    • 所有在線演示使用querySelector。 這打破IE8(compatbility模式)。
    • 增加了一個填充工具為querySelector和[].forEach。 這僅影響IE8在線演示。 固定。
    • 增加了一個String.trim填充工具
    • 修正了在哽咽IE8 Dispose方法
  • 其他事宜:
    • 內聯的方式加入高的z-index為了支持菜單時。
    • 在在Firefox,其中動畫是震盪和緩慢的CSS3過渡修正閃爍。
    • 添加了文檔中的一個缺失的環節。
  • 2012年8月10日變更集3.0
  • 增加了對接在左上角,右上角和右下角的菜單支持。 以前我們必須只左下角的支持。 現在,我們支持在所有4個角落的畫面對接。
  • 對接現在在正確的Andr​​oid 4.0支持++,因為它支持CSS的定位很好。 它應該在的iOS 5同樣的工作(如果沒有舉報,感謝)。
  • 增加了內嵌的菜單支持。
  • 我們現在支持11種不同的風格奠定了菜單:
    1. PathMenu.ExpandPattern.circle
    2. PathMenu.ExpandPattern.lineTop
    3. PathMenu.ExpandPattern.lineRight
    4. PathMenu.ExpandPattern.lineBottom
    5. PathMenu.ExpandPattern.lineLeft
    6. PathMenu.ExpandPattern.lineMiddleHorizo​​ntal
    7. PathMenu.ExpandPattern.lineMiddleVertical
    8. PathMenu.ExpandPattern.leftBottomFixedArc
    9. PathMenu.ExpandPattern.leftTopFixedArc
    10. PathMenu.ExpandPattern.rightBottomFixedArc
    11. PathMenu.ExpandPattern.rightTopFixedArc
  • 增加了菜單的多個實例支持
  • 增加了對按鈕的文本內容的支持。
  • 增加了對圖像蒙版的支持。
  • 擴展的API和暴露的新方法和屬性,特別是那些你可以用它來動態地添加菜單項。 參考有關詳細信息的文檔。 此外,我們還添加了一個新的實驗室演示,展示更複雜的情況,如在運行時添加菜單項。
  • 2012年6月12日變更集1.9
  • 修正了當地址欄沒有補償手持設備中的錯誤。 這導致在菜單中的觸摸操作時沒有做任何事情。
  • 增加了一個默認的z-index以確保菜單始終高於其所在頁面上的所有其他元素。
  • 2012年5月19日chagneset 1.8
  1. 增強型曲線
  2. 增加了點擊進入該文件時,請關閉菜單支持。 這僅僅是對桌面。 對觸摸功能的設備,你必須使用的關閉按鈕。
  3. 增加了對工具提示的支持。 這僅適用於桌面(非觸摸功能的設備)。 檢查如何讓你的菜單項的工具提示的文檔。
  4. onSelectedItem處理器現在包括點擊的菜單項的標題為好,這是在回調參數傳遞。
  5. 媒體查詢。 現在,您可以通過視口的寬度來控制如列表:[{“了minWidth':640,'了maxWidth”:1024}],它會表現自己,如果這個條件被請求的設備/瀏覽器滿足。
  6. 水平滾動條的厚度並沒有補償放置菜單中的視口的左下角時。 現在,這是固定的。
  7. 然而,大多數的最大特點,因為它已被要求多次的是,我們現在有一個WordPress插件(已經提交審核)。
  • 2012年5月19日變更集1.8:
  1. 固定定位錯誤:如果你有只有一個菜單項,並用正確的曲線將其設置仍然留在主菜單後面隱藏。
  2. 固定僅供參考(調試模式)元素層次發電機,其中一個額外的菜單項被列入輸出。
  3. 修正了影響多導航的錯誤。 基本上當你有超過1菜單項超過100分的水平,將有一個查詢股價。
  4. 修復了受影響的第一個菜單項的錯誤。 單擊第一個菜單項時滾動出視野的其他人一樣,當它不會向外擴展。
  5. 現在的導航圖標從一個子菜單到另一個重新定位自己。 這使得圖標來維持其作為弧的菜單項可以從數子而異子菜單。
  • 2012/5/15注意:1.8(即將推出)
  • 2012年4月28日變更集:1.7
  • 固定的小IE瀏覽器漏洞。
  • 增加了新的在線演示頁面,包含源碼包。
  • 增加了對散列符號的支持。 現在,如果enableUrlHash為真(默認為false),那麼當你點擊它的命令將在url中得到追加,就像在新的在線演示的菜單項。
  • 04月26日變更集:1.6
  • 當子菜單的擴大轉變是生澀。 固定。
  • Opera Mini的失去了平穩過渡,當我們升級到1.5。 現在,這是固定的。
  • 後退按鈕圖標1.5使用的箭頭; 這不借給自己太多了。旋轉效果。 為了彌補這一點,我們已經增加了旋轉,但這不是太好。 我們現在減少旋轉回是怎麼回事,改變圖標的東西好得多。
  • 記錄了調試功能,將打印出你的菜單結構,所以你可以看到你的菜單的ID的模樣,以減輕您的開發工作是什麼。 這是在演練記錄。
  • 更新在家裡文件夾中的文件walkthrough.html帶來的最新變化加快。
  • 暴露的新方法toggleMainButton。 這可以用toggleMenuExpansion方法相結合。
  • 2012年4月24日變更集1.5:
  • 我們現在支持多級子菜單。
  • 該API仍然與以前的版本保持一致。
  • 增加了對多級子菜單的文檔。 這是你在演練頁面下載的一部分。
  • 這實際上是一個相當大的變化和代碼庫已發生了部分重寫。 請享用!
  • 04/17/2012變更集1.4
  • 在手持設備上固定觸摸錯誤
  • 修正了Dispose方法的錯誤
  • - 現在當菜單被處置正確的清除正在發生。
  • 04/16/2012變更集1.3
  • 暴露set_curve(值)公共方法
  • 露卡()公共方法
  • 在以下位置ProjectPathMenu的\ src \ COM \ pathmenu \回家
  • - 新增index.html中一個額外的演示,展示設置子菜單項的曲線圖案。
  • - 增加了一個演練教程,使終端用戶更加容易。
  • - 增加了演示頁只包括菜單減少分心的機會。
  • 2012年4月15日更改設定1.2
  • 公開的公共方法:toggleMenuExpansion
  • 公開的公共方法:get_toggleState
  • 在索引文件(同實時預覽)增加了代碼示例顯示怎麼回事toggleMenuExpansion和get_toggleState可以使用。
  • 改組樣本頁面用新折的橫幅為移動/桌面設備一點點
  • 2012年4月14日更改設置1.1:XXX

下載
此類別中的其他組成部分這個作者的所有組件
評論常見問題和答案

屬性

創建:
12年4月13日

最後更新:
13年5月29日

兼容的瀏覽器:
IE8,IE9,火狐,Safari,歌劇,鉻

包括文件:
JS的JavaScript,HTML,CSS

關鍵字

電子商務, 電子商務, 所有項目, 安卓, CSS3過渡, 定制, 桌面, 手持, iPad的, iphone, 菜單, 移動, 導航欄, 導航, 迴轉, 滑動, 片劑, WP7