לבנות אתר אינטרנט להתקנים ניידים עם Jquery Mobile

jQuery Mobile היא מערכת ממשק מגע אופטימיזציה, משתמש מבוסס HTML5.היא בנויה על פלטפורמת jQuery ו- jQuery UI, וזה אידיאלי לפיתוח נייד מהיר.המסגרת הניידת jQuery מנצלת תכונות מיוחדות כדי לעזור להגדיר ולעצב האלמנטים שלך, ללא צורך בכתיבה בכיתה מפורטת הכללים.

1. 1
   נווט לדף הבית של jQuery Mobileולאחר מכן לחץ על הכרטיסייה "הורדה" מתפריט הניווט הראשי.

   פרסומת

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
2. 2
   גלול למטה בדף הורדה עד שתראה העתק והדבק קטע עבור סעיף קבצים מארחת CDN.

   העתק את שורות קוד על הלוח שלך.הפניה קבצים שלושת אלה הם כל מה שאתה צריך כדי ליישם את המסגרת.

   פרסומת

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
3. 3
   להרחיב פיתוח תוכנה המועדף עליך וליצור מסמך HTML חדש.

   instagram viewer

   אם אין לך תוכנת פיתוח, פתח את יישום פנקס הרשימות במחשב.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
4. 4
   מוסיפים את אזכור מסמך ה- HTML שלך.

   בתוך התגיות ראש שלך, הדבק את הקישורים קובץ מארחת CDN.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
5. 5
   צור "דף" הראשון שלך.

   עם המסגרת הניידת jQuery, אתה תיצור דפים מרובים בתוך אותו מסמך HTML.בתוך התגיות הגוף , ליצור מיכל div.תוסיף תכונת נתוני תפקיד , ולהקצות לו את ערך של דף .לבסוף, מוסיפים את תכונת מזהה , ולהקצות לו את הערך של הביתה .

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
6. 6
   מוסיפים את הכותרת , תוכן ו תחתונה div מכולות .

   בתוך מיכל div בדף שלך, ליצור שלושה תגי div יותר.שימוש במאפיין נתוני תפקיד , להקצות ערכים של הכותרת , תוכן ו תחתונה בהתאמה.זהו המבנה הבסיסי של דף הנייד jQuery.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
7. 7
   להוסיף כותרת וכותרות תחתונה .

   שימוש h1 כותרת תג, ליצור כותרת כותרים עבור תגי הכותרת עליונים ותחתון שלך.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
8. 8
   צור העמוד השני.

   החיצוני של המיכל div שתכונת נתוני תפקיד שלה מוגדר הדף, ליצור מיכל div חדש.תוסיף תכונת נתוני תפקיד , ולאחר מכן להגדיר אותו לדף.תוסיף תכונת מזהה , ולאחר מכן להגדיר אותו לדף 2. לבסוף, מוסיף מכולות div עבור הכותרת, התוכן עליון ותחתון, ולכן המבנה דומה בדף הבית.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
9. 9
   צור דף התפריט.

   דף התפריט הולך להיווצר באותו אופן כמו את שני העמודים הראשונים, אך ללא כותרת תחתונה.צור מיכל div, ולהגדיר תכונה נתוני תפקיד שלה לדף.תוסיף תכונת מזהה , ולתת לו ערך של main_nav.

   היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
10. 10
    צור את מבנה תפריט הניווט.

    בתוך מיכל div תוכן , ליצור רשימה לא מסודרת.תוסיף תכונת נתוני תפקיד , ולהגדיר את הערך שלו ל ListView.תוסיף תכונת נתוני הבלעת , ולהגדיר את הערך שלו כאמת.בתוך התגיות ul עבור רשימה לא מסודרת, להוסיף שני תגים רשימה-פריט( תגי li).

    היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
11. 11
    צור את הקישורים בתפריט.

    בתוך תגיות רשימה-הפריט הראשון, ליצור תג עוגן.תוסיף תכונת href אל תג העוגן.השתמש סמל hashtag למקד תכונה מזהה , ולאחר מכן הקלד "הביתה".זו ממקדת את מכל div "הביתה".בצע אותו תהליך עבור הרשימה-הפריט השני, אבל הפעם hashtag סוג "page2" למקד את העמוד השני.

    היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
12. 12
    להוסיף קישורים התפריט לדפים אחרים .

    עכשיו כי התפריט שלך נוצר, עליך להגדיר תגי עוגן על "הביתה" ו "דף 2" את הדפים כדי לגשת אליו.גלילה למעלה ומצאתי את קטע כותרת של דף הבית שלך.להוסיף תג עוגן בתוך המכל הכותרת, ממש לפני תג h1 .תוך שימוש באותו תהליך המקשר כפי שעשית עם התפריט, להגדיר את התכונה href כדי hashtag "main_nav".תוסיף תכונת נתוני תפקיד , ולתת לו ערך של כפתור.תוסיף תכונת נתוני סמל , ולתת לו ערך של ברים.לבסוף, מוסיפים את תכונת נתוני iconpos , ולתת לו ערך של notext.זה יוצר כפתור בצד שמאל של טקסט הכותרת שלך.חזור על שלב זה עבור דף page2.

    היה צעד זה היה מועיל?כן |אין |אני זקוק לעזרה
    פרסומת

• ליצור כמה דפים בתוך אותו מסמך HTML כמו שאתה אוהב.jQuery Mobile משתמשת מערכת ניווט AJAX כי בעיטות באופן אוטומטי בעת יצירת דפים מרובים באותו מסמך.
• יוסיף תכונת נתוני המעבר לעוגנים למעבר לפייס ויזואלית בין הדפים.המעברים הקיימים הם לדעוך, פופ, להעיף, בתורו, זרימה, slidefade, שקופיות, slideup ו slidedown.
• השתמש נתוני נושא לייחס לסגנון כמעט כל אלמנט בפרויקט שלך.כברירת מחדל, jQuery Mobile מגיע עם חמש דוגמיות צבע כדי שתוכל להשתמש.מערכת ערכות הנושא משתמשת באותיות כערכים.כתוצאה מכך, תכונת נתוני נושא מקבלת ערכים של a, b, c, d ו- e כאשר אתה ראשון להוריד אותו.בדקו את jQuery Mobile Themeroller ליצור עיצוב מותאם אישית, עם עד 26 דוגמיות צבע שונים!
• השתמש נתוני המיקום מייחסים ליצור "דביק" או קבוע כותרות עליונות ותחתונות עבור אתר האינטרנט שלך.הוסף את המאפיין הזה למיכל div כי יש להגדיר נתוני תפקיד שלה כותרת עליונה או תחתונה, והערך נתוני המיקום כדי קבוע.
• בודק את ערכת צבע Mobile jQuery כדי להתחיל לפתח עם 26 דוגמיות נושא שונים.

• הקפד להשתמש הערות HTML להפריד דפים ניידים jQuery שלך.זה חוסך לך המון זמן בהמשך הדרך, כמסמך HTML יחיד עם מספר "דפים" מקבל מנופח די מהר.

• jQuery Mobile צבע ערכת
• jQuery Mobile
• jQuery Mobile Themeroller
• אם יש לך בעיות עם כל אחד משלבים אלה, לשאולשאלה לקבלת עזרה נוספת, או לכתוב בסעיף ההערות למטה.