יצירת תפריט ניווט חכם יותר עם תוסף זה jQuery
כל אתר מודרני צריך פריסה תגובה א ניווט שמיש. זה נתון.
אבל, תפריטים ההמבורגר יכול רק ללכת כל כך רחוק והם לשנות באופן קיצוני שימושיות עבור גדלי מסך משתנים. הדרך הטובה ביותר להתמודד עם זה היא על ידי בהסתרת קישורים עם תוסף כגון אוקיי.
זה תוסף חינם jQuery מוסיף תכונה בתפריט פשוט מאוד לכל דף וזה sנמוך מסתירה פריטים ניווט, מבוסס על נופים שונים. בדרך זו משתמשים החכם יש תפריט המבורגר יחיד, אבל משתמשים בטאבלט יכולים לראות כמה קישורים, גם.
כברירת מחדל, הוא מסתמך על אלמנט א רשימה ארוכה לא מסודרת. עד כה, אני לא חושב תוסף זה תומך ברמה מרובת רמות dropdowns אבל אם אתה יודע קצת jQuery אתה יכול להוסיף את זה בעצמך.
OkayNav הוא מאוד פשוט וזה המיועד לאתרים פשוטים יותר כי יש רק קומץ קישורי ניווט. קישורים אלה לאט להסתתר מאחורי תפריט מחוץ למסך פעם אחת הם פגע מסוים ופורט קישורים נוספים מסתירים קטן הדפדפן מקבל.
יהיה עליך לעטוף את רשימת unordered ב אלמנט ניווט ולתת לו מזהה מסוים. אז את \ ה יכול \ ה המטרה- הני Nav כולו עם ה okayNav () פונקציה זו:
var ניווט = $ ('# nav-main'). הערה זה רק ההתקנה הפשוטה ביותר ללא כל תכונות מותאמות אישית. אתה יכול לעבוד עם מעל תריסר אופציות מותאמות אישית מובנה בתוך ספריה זו כדי לשלוט על סגנון האיקונים, אנימציה התפריט, לסחוב תמיכה, פונקציות התקשרות.
בנוסף, אתה יכול אפילו לקרוא את התפריט פתוח / סגור כרצונו על ידי העברת ערכים ספציפיים לפונקציה. הנה דוגמה פשוטה לפתוח את הניווטYou
nav.okayNav ('openInvisibleNav'); כל הקודים האלה מתועדים היטב GitHub ריפו אשר כולל גם הורדה של התסריט. אם אתה מעדיף את המסלול CDN אתה יכול גם להשתמש קישור RawGit כדי להוסיף סקריפט זה ישירות מ- GitHub.
OkayNav הוא נהדר עבור אתרים קטנים יותר כי תועלת טכניקה ניווט מתקדמת. אבל, אם אתה עדיין לא בטוח איך זה עובד לבדוק את ההדגמה על CodePen מראה מה זה תוסף קטן יכול לעשות.
