Ինչ իմանալ
- Գնալ Insert > Ձև > Ձև: Կտտացրեք ձևի կետավոր կարմիր գիծը և անցեք Insert > Form > Ցուցակ/Մենյու: Ընտրեք մատչելիության տարբերակներ։
- Սեղմեք ընտրացանկը և ընտրեք դրա հատկությունները, այնուհետև ընտրեք List values ՝ նոր ընտրացանկի տարրեր ավելացնելու համար: Սեղմեք գումարած նշանը՝ ավելի շատ տարրեր ավելացնելու համար:
- Ավելացրեք ապրանքի արժեքներ և ընտրեք լռելյայն տարր: Գործողություններ ավելացնելու համար անցեք Insert > Ձև > Jump Menu: Ավելացրեք տարրեր Jump մենյուում և պահպանեք:
Dreamweaver-ը հեշտացնում է ձեր կայքի համար բացվող ընտրացանկերի ստեղծումը: Բայց ինչպես բոլոր HTML ձևերը, դրանք կարող են մի փոքր բարդ լինել: Այս ձեռնարկը ձեզ կուղեկցի Dreamweaver-ում բացվող մենյու ստեղծելու քայլերով:
Dreamweaver Jump Menu
Dreamweaver 8-ը նաև տրամադրում է կախարդ՝ ձեր վեբ կայքում նավարկելու համար թռիչքային ընտրացանկ ստեղծելու համար: Ի տարբերություն հիմնական բացվող ընտրացանկերի, այս ընտրացանկը ինչ-որ բան կանի, երբ ավարտեք: Դուք ստիպված չեք լինի գրել JavaScript կամ CGI, որպեսզի ձեր բացվող ձևն աշխատի: Այս ձեռնարկը նաև բացատրում է, թե ինչպես օգտագործել Dreamweaver 8 մոգը՝ թռիչքի մենյու ստեղծելու համար:
Նախ, ստեղծեք ձևը
Բացառությամբ հատուկ կախարդների, ինչպիսին է jump menu-ը, Dreamweaver-ը չի օգնում ձեզ «աշխատել» HTML ձևերը: Դրա համար ձեզ անհրաժեշտ է CGI կամ JavaScript:
Երբ ձեր վեբ կայքին բացվող ընտրացանկ եք ավելացնում, առաջին բանը, որ ձեզ անհրաժեշտ է, այն շրջապատող ձևն է: Dreamweaver-ում գնացեք Տեղադրել ընտրացանկը և կտտացրեք Ձևը, այնուհետև ընտրեք «Ձևը»:
Ձևը ցուցադրվում է դիզայնի տեսքում
Dreamweaver-ը դիզայնի տեսքում տեսողականորեն ցույց է տալիս ձեր ձևի գտնվելու վայրը, այնպես որ դուք գիտեք, թե որտեղ տեղադրել ձեր ձևի տարրերը, քանի որ բացվող ընտրացանկի պիտակները վավեր չեն (և չեն աշխատի) ձևի տարրից դուրս: Ինչպես տեսնում եք նկարում, ձևը դիզայնի տեսքով կարմիր կետավոր գիծ է:
Ընտրեք Ցուցակ/Մենյու
Բացվող ընտրացանկերը Dreamweaver-ում կոչվում են «ցուցակ» կամ «մենյու»: Այսպիսով, ձեր ձևին մեկ ավելացնելու համար դուք պետք է մտնեք «Ձև» մենյու «Տեղադրել» ցանկի մեջ և ընտրեք «Ցուցակ/Մենյու»: Համոզվեք, որ ձեր կուրսորը գտնվում է ձեր ձևի վանդակի կարմիր կետավոր գծի մեջ:
Հատուկ ընտրանքների պատուհան
Dreamweaver Options-ում կա Մատչելիության էկրան: Ձեր բացվող ընտրացանկերը անմիջապես ավելի հասանելի կլինեն, քան մյուս կայքերը, եթե լրացնեք այս հինգ տարբերակները:
Ձևի մատչելիություն
Մատչելիության տարբերակներն են՝
Label
Պիտակի դաշտը հայտնվում է որպես տեքստ ձեր ձևի տարրի կողքին: Մուտքագրեք անուն ձեր բացվող ցանկի համար: Դա կարող է լինել հարց կամ կարճ արտահայտություն, որին կպատասխանի բացվող ընտրացանկը:
Ոճ
HTML-ը ներառում է պիտակի պիտակ՝ ձեր ձևի պիտակները վեբ դիտարկիչում նույնականացնելու համար: Ձեր ընտրությունն է` փաթեթավորեք բացվող ընտրացանկը և պիտակի տեքստը պիտակի հետ, օգտագործեք «for» հատկանիշը պիտակի պիտակի վրա՝ պարզելու համար, թե որ ձևի թեգն է այն հղում, կամ ընդհանրապես չօգտագործել պիտակի պիտակը:
Պաշտոն
Դուք կարող եք տեղադրել ձեր պիտակը բացվող ընտրացանկից առաջ կամ հետո:
Մուտքի բանալի
Այցելուները կարող են օգտագործել մուտքի բանալի «Պատկեր» կամ Ընտրանք ստեղներով՝ անմիջապես այդ ձևի դաշտ մտնելու համար: Այս ստեղնաշարի դյուրանցումը ձեր ձևերը շատ հեշտ է դարձնում առանց մկնիկի օգտագործման: alt="
ներդիրի ինդեքս
Ներդիրների ինդեքսն այն է, թե ինչպես օգտվողները պետք է մուտք գործեն ձևի դաշտեր, երբ ստեղնաշարն օգտագործում են ներդիր վեբ էջի միջոցով:
Երբ թարմացնեք ձեր մատչելիության ընտրանքները, սեղմեք Լավ:
Ընտրեք ընտրացանկը
Երբ ձեր բացվող ընտրացանկը ցուցադրվի Dreamweaver դիզայնի տեսքով, դուք պետք է ավելացնեք տարբեր տարրեր: Նախ, ընտրեք բացվող ընտրացանկը, սեղմելով դրա վրա: Dreamweaver-ը մեկ այլ կետագիծ կդնի միայն բացվող ցանկի շուրջ՝ ցույց տալու համար, որ դուք ընտրել եք այն:
Մենյուի հատկություններ
Հատկությունների ընտրացանկը կփոխվի այդ բացվող ընտրացանկի ցուցակի/մենյուի հատկությունների: Այնտեղ կարող եք ձեր մենյուին տալ ID (որտեղ գրված է «ընտրել»), որոշել՝ ուզում եք, որ այն լինի ցանկ, թե ընտրացանկ, ձեր ոճի թերթիկից տալ ոճի դաս և արժեքներ նշանակել բացվող ցանկին::
Ի՞նչ տարբերություն կա ցուցակի և մենյուի միջև:
Dreamweaver-ը մենյուի բացվող ընտրացանկ է անվանում ցանկացած բացվող ցանկ, որը թույլ է տալիս միայն մեկ ընտրություն: «Ցուցակը» թույլ է տալիս մի քանի ընտրություն կատարել բացվող ցանկում և կարող է լինել ավելի քան մեկ տարր:
Եթե ցանկանում եք, որ բացվող ընտրացանկը լինի մի քանի տող, փոխեք այն «ցուցակ» տեսակի և թողեք «ընտրություններ» վանդակը չնշված:
Ավելացնել ցուցակի նոր տարրեր
Ձեր մենյուում նոր տարրեր ավելացնելու համար սեղմեք «List values…» կոճակը, որը բացում է վերը նշված պատուհանը: Այնուհետև մուտքագրեք ձեր ապրանքի պիտակը առաջին վանդակում: Այն կցուցադրվի էջում։
Ավելացնել ավելին և վերապատվիրել
Սեղմեք գումարած պատկերակի վրա՝ ավելի շատ տարրեր ավելացնելու համար: Եթե ցանկանում եք դրանք նորից դասավորել ցուցակի վանդակում, օգտագործեք աջ կողմում գտնվող վեր և վար սլաքները:
Տվեք բոլոր ապրանքների արժեքները
Եթե արժեքը դատարկ թողնեք, պիտակը կանցնի ձևին: Բայց դուք կարող եք տալ ձեր բոլոր տարրերի արժեքները՝ ձեր ձևին այլընտրանքային տեղեկատվություն ուղարկելու համար: Դուք սա շատ կօգտագործեք այնպիսի բաների համար, ինչպիսիք են jump menus և hyperlinking:
Ընտրեք լռելյայն
Վեբ էջերը լռելյայն ցուցադրում են այն բացվող տարրը, որն առաջինը նշված է որպես լռելյայն տարր: Բայց եթե ցանկանում եք ընտրել մեկ ուրիշը, ընդգծեք այն «Ի սկզբանե ընտրված» վանդակում Հատկությունների ցանկում:
Տեսեք ձեր ցուցակը դիզայնի դիտում
Հատկությունների խմբագրումը ավարտելուց հետո Dreamweaver-ը կցուցադրի ձեր բացվող ցուցակը՝ ընտրված լռելյայն արժեքով:
Տեսեք ձեր ցուցակը Code View-ում
Եթե անցնեք կոդի դիտմանը, կարող եք տեսնել, որ Dreamweaver-ն ավելացնում է ձեր բացվող ընտրացանկը մաքուր կոդով: Միակ լրացուցիչ հատկանիշները հասանելիության տարբերակներն են: Կոդն ամբողջությամբ ներքև է և շատ հեշտ է կարդալ և հասկանալ:
Պահպանել և դիտել դիտարկիչում
Եթե պահպանեք փաստաթուղթը և դիտեք այն վեբ բրաուզերում, կտեսնեք, որ ձեր բացվող ընտրացանկը ճիշտ այնպես տեսք ունի, ինչպիսին կակնկալեիք:
Բայց դա ոչինչ չի անում…
Վերևում ստեղծած ընտրացանկը լավ տեսք ունի, բայց ոչինչ չի անում: Այն ինչ-որ բան անելու համար հարկավոր է ձևի գործողություն կարգավորել հենց ձևի վրա:
Բարեբախտաբար, Dreamweaver-ն ունի ներկառուցված բացվող մենյուի ձև, որը կարող եք անմիջապես օգտագործել ձեր կայքում՝ առանց ձևերի, CGI-ների կամ սցենարների մասին սովորելու անհրաժեշտության: Այն կոչվում է Jump Menu:
Dreamweaver Jump Menu-ն ստեղծում է բացվող ընտրացանկ՝ անուններով և URL-ներով: Այնուհետև դուք կարող եք ընտրել ընտրացանկից որևէ տարր, և վեբ էջը կտեղափոխվի այդ վայր, ճիշտ այնպես, ինչպես եթե սեղմեիք հղումը:
Գնացեք Տեղադրել ընտրացանկը և ընտրեք Ձև, այնուհետև Անցնել ընտրացանկ:
Jump Menu պատուհան
Ի տարբերություն ստանդարտ բացվող մենյուի, Jump ընտրացանկը բացում է նոր պատուհան, որպեսզի կարողանաք անվանել ձեր ընտրացանկի տարրերը և ավելացնել մանրամասներ այն մասին, թե ինչպես պետք է աշխատի ձևը:
Առաջին կետի համար փոխեք «un titled1» տեքստը, ինչ ուզում եք կարդալ և ավելացրեք URL:
Ավելացրեք տարրեր ձեր Jump ընտրացանկում
Սեղմեք ավելացնել տարրի վրա՝ նոր տարր ավելացնելու ձեր թռիչքի ընտրացանկում: Ավելացրեք այնքան իրեր, որքան ցանկանում եք:
Jump Menu Options
Հենց որ ավելացնեք ձեր ուզած բոլոր հղումները, պետք է ընտրեք ձեր տարբերակները՝
Բացել URL-ները -ում
Եթե ունեք շրջանակների հավաքածու, կարող եք բացել հղումները այլ շրջանակում: Կամ կարող եք փոխել Հիմնական պատուհանի տարբերակը հատուկ թիրախի, որպեսզի URL-ը բացվի նոր պատուհանում կամ այլ տեղ:
Մենյուի անունը
Տվեք ձեր մենյուին էջի եզակի ID: Դա անհրաժեշտ է, որպեսզի սցենարը ճիշտ աշխատի: Այն նաև թույլ է տալիս մեկ ձևով ունենալ բազմաթիվ թռիչքային ընտրացանկեր՝ բոլորին տալ տարբեր անուններ:
Տեղադրեք Go կոճակը ընտրացանկից հետո
Ինձ դուր է գալիս ընտրել սա, քանի որ երբեմն սկրիպտը չի աշխատում, երբ ընտրացանկը փոխվում է: Այն նաև ավելի մատչելի է։
Ընտրեք առաջին կետը URL-ի փոփոխությունից հետո
Ընտրեք սա, եթե ունեք հուշում, ինչպիսին է «Ընտրեք մեկը» որպես ընտրացանկի առաջին տարր: Սա կապահովի, որ այդ տարրը մնա լռելյայն էջում:
Jump Menu Design View
Ինչպես ձեր առաջին մենյուի դեպքում, Dreamweaver-ը կարգավորում է ձեր թռիչքի ընտրացանկը դիզայնի տեսքով՝ կանխադրված տարրը տեսանելի դարձնելով: Դուք կարող եք այնուհետև խմբագրել բացվող ընտրացանկը, ինչպես ցանկացած այլ:
Եթե խմբագրում եք այն, համոզվեք, որ չփոխեք տարրերի որևէ ID-ներ. հակառակ դեպքում, սցենարը կարող է չաշխատել:
Jump ընտրացանկ զննարկիչում
Ֆայլը պահելով և F12 սեղմելով՝ էջը կցուցադրվի ձեր նախընտրած բրաուզերում: Այնտեղ կարող եք ընտրել որևէ տարբերակ, սեղմել «Գնալ», և ցատկման ընտրացանկը կաշխատի:
