எப்படி ட்ரீம்வீவர் ஒரு டிராப் டவுன் பட்டி உருவாக்க

ட்ரீம்வீவர் உங்கள் வலைத்தளத்திற்கான மெனுக்களை உருவாக்க எளிதாக்குகிறது. ஆனால் அனைத்து HTML படிவங்களை போல அவர்கள் ஒரு பிட் தந்திரமான இருக்க முடியும். இந்த பயிற்சி ட்ரீம்வீவர் ஒரு துளி மெனு உருவாக்கும் நடவடிக்கைகளை மூலம் நீங்கள் நடக்கும்.

ட்ரீம்வீவர் தாவி செல்லவும்

ட்ரீம்வீவர் 8 உங்கள் வலைத்தளத்திலுள்ள ஊடுருவலுக்கான ஒரு ஜம்ப் மெனுவை உருவாக்க வழிகாட்டி அளிக்கிறது. அடிப்படை சொடுக்கி மெனுக்களைப் போலல்லாமல், இந்த மெனு நீங்கள் முடிந்தபோதே ஏதோ ஒன்று செய்வீர்கள். வேலை செய்ய உங்கள் படிவம் வடிவம் பெற நீங்கள் எந்த JavaScript அல்லது CGI கள் எழுத வேண்டும். ட்யூம்வீவர் 8 வழிகாட்டி எவ்வாறு ஒரு ஜம்ப் மெனுவை உருவாக்குவது என்பதை இந்த டுடோரியல் விளக்குகிறது.

20 இன் 01

முதலில் படிவத்தை உருவாக்குங்கள்

HTML படிவங்கள் மற்றும் ட்ரீம்வீவர் பற்றி முக்கிய குறிப்பு:

ஜம்ப் பட்டி போன்ற சிறப்பு வழிகாட்டிகள் தவிர, ட்ரீம்வீவர் HTML படிவங்களை "வேலை" செய்ய உதவாது. இதற்கு CGI அல்லது JavaScript தேவை. தயவுசெய்து என் டுடோரியல் பார்க்கவும் HTML படிவங்களை செய்தல் மேலும் தகவலுக்கு வேலை செய்யவும்.

உங்கள் வலைத்தளத்திற்கு ஒரு கீழ்தோன்றும் மெனுவைச் சேர்க்கும்போது, ​​உங்களுக்கு தேவையான முதல் விஷயம் அதைச் சுற்றி ஒரு வடிவம். ட்ரீம்வீவர் இல், நுழைவு மெனுவிற்கு சென்று படிவத்தை கிளிக் செய்து, "படிவம்" என்பதைத் தேர்வு செய்யவும்.

20 இன் 02

வடிவமைப்பு பார்வையில் படிவம் காட்சிகள்

ட்ரீம்வீவர் வடிவமைப்பு வடிவத்தில் பார்வைக்கு உங்கள் படிவத்தை காட்சிப்படுத்துகிறது, எனவே உங்கள் வடிவம் கூறுகளை எங்கே வைக்க வேண்டும் என்று உங்களுக்குத் தெரியும். இது முக்கியமானது, ஏனென்றால் வடிவம் உறுப்புக்கு வெளியே உள்ள கீழ்தோன்றும் மெனு குறிச்சொற்கள் செல்லுபடியாகாது (மற்றும் இயங்காது). படத்தில் நீங்கள் காணக்கூடியபடி, வடிவம் வடிவமைப்பு பார்வையில் சிவப்பு புள்ளியாக உள்ளது.

20 இல் 03

பட்டியல் / மெனுவை தேர்வு செய்யவும்

Drop-down மெனுக்களை ட்ரீம்வீவர் உள்ள "பட்டியல்" அல்லது "மெனு" உருப்படிகளாக அழைக்கப்படுகின்றன. உங்கள் படிவத்தில் ஒன்றைச் சேர்க்க, நீங்கள் நுழைவு மெனுவில் படிவம் மெனுவில் சென்று "பட்டியல் / பட்டி" என்பதைத் தேர்வு செய்ய வேண்டும். உங்கள் கர்சர் உங்கள் படிவ பெட்டியின் சிவப்பு புள்ளியில் உள்ளதை உறுதி செய்து கொள்ளுங்கள்.

20 இல் 04

சிறப்பு விருப்பங்கள் சாளரம்

ட்ரீம்வீவர் விருப்பங்கள் அணுகல் மீது ஒரு திரை உள்ளது. நான் ட்ரீம்வீவர் எல்லா அணுகல்தன்மை பண்புகளையும் காட்டுகிறேன். இந்த திரை இதன் விளைவாக இருக்கிறது. படிவங்கள் பல இணைய தளங்கள் அணுகுவதில் குறைந்து, இந்த ஐந்து விருப்பங்களை நிரப்புவதன் மூலம் உங்கள் கீழ்தோன்றும் மெனுக்களை உடனடியாக அணுக முடியும்.

20 இன் 05

படிவ அணுகல்

அணுகல்தன்மை விருப்பங்கள்:

லேபிள்

இந்த புலம் பெயர். இது உங்கள் படிவத்தின் உறுப்புக்கு அருகில் உரையாக காட்டப்படும்.
உங்கள் சொடுக்கி மெனுவை அழைக்க விரும்புகிறீர்களா என்பதை எழுதுங்கள். இது கீழ்தோன்றும் மெனு பதிலளிக்கும் ஒரு கேள்வி அல்லது குறுகிய சொற்றொடராக இருக்கலாம்.

பாணி

உங்கள் வடிவம் லேபிள்களை உலாவியில் அடையாளம் காண, லேபிள் குறியை HTML கொண்டுள்ளது. லேபிள் டேக் மீது பண்புக்கூறு குறிச்சொல் குறிச்சொல் குறிச்சொல் குறிச்சொல் குறிச்சொல் குறிப்பில் எந்த குறிப்பைக் குறிக்க அல்லது லேபிள் குறிச்சொல்லை பயன்படுத்துவதைக் குறிக்க பயன்படுத்த, உங்கள் குறிப்புகள் கீழ்தோன்றும் பட்டி மற்றும் லேபிள் உரையை குறிச்சொல்லுடன் போட வேண்டும்.
நான் பண்புக்காக பயன்படுத்த விரும்புகிறேன், அதன்பிறகு சில காரணங்களுக்காக லேபிளை நகர்த்த வேண்டியிருந்தால், அது இன்னும் சரியான படிவத்துடன் இணைக்கப்படும்.

நிலை

கீழ்தோன்றும் மெனுவிற்கு முன் அல்லது பின் உங்கள் லேபிளை நீங்கள் வைக்கலாம்.

அணுகல் விசை

இந்த வடிவம் புலத்தில் நேரடியாக பெற Alt அல்லது விருப்பத்தேர்வு விசைகளுடன் சேர்த்து பயன்படுத்தக்கூடிய விசையாகும். இது ஒரு சுட்டி தேவையில்லாமல் உங்கள் படிவங்களை மிகவும் எளிதாக்குகிறது. HTML இல் ஒரு அணுகல் விசையை அமைப்பது எப்படி

தாவல் அட்டவணை

இது வலைப்பக்கத்தின் மூலம் தாவலுக்கு விசைப்பலகையை பயன்படுத்தும் போது படிவத் துறையில் அணுக வேண்டிய கட்டளையாகும். Tabindex புரிந்துகொள்ளுதல்

அணுகல் விருப்பங்களை நீங்கள் புதுப்பிக்கும்போது, ​​சரி என்பதைக் கிளிக் செய்யவும்.

20 இல் 06

மெனுவைத் தேர்ந்தெடுக்கவும்

வடிவமைப்பு பார்வையில் உங்கள் மெனுவினைக் காண்பிப்பதைப் பெற்றதும், அதனுடன் பல்வேறு கூறுகளை சேர்க்க வேண்டும். முதலில் கிளிக் செய்வதன் மூலம் கீழ்தோன்றும் மெனுவைத் தேர்ந்தெடுக்கவும். ட்ரீம்வீவர் நீங்கள் தேர்ந்தெடுத்ததைக் காட்ட, ஒரு கீழ்தோன்றும் மெனுவில் மற்றொரு புள்ளியிடப்பட்ட வரிகளை வைக்கும்.

20 இன் 07

பட்டி பண்புகள்

பண்புகள் மெனு அந்த மெனுவினை பட்டியலிட / பட்டியல் பட்டியலில் மாற்றும். அங்கே உங்கள் மெனுவை ஒரு அடையாள அட்டையை ("தேர்ந்தெடு" என்று குறிப்பிடுகிறீர்கள்), நீங்கள் ஒரு லிஸ் அல்லது மெனுவாக விரும்பினால், உங்கள் ஸ்டைல் ​​ஷீட்டில் இருந்து ஒரு பாணி வகுப்பை கொடுங்கள், மேலும் கீழ்தோன்றல் மதிப்புகளுக்கு ஒதுக்க வேண்டும்.

பட்டியல் மற்றும் மெனுவில் உள்ள வித்தியாசம் என்ன?

ட்ரீம்வீவர் மெனுவை கீழிறங்கும் மெனுவிற்கு எந்த ஒரு கீழும் கீழே கொடுக்கிறது, அது ஒரே ஒரு தேர்வை அனுமதிக்கிறது. ஒரு "பட்டியலை" கீழ்தோன்றும் பல விருப்பங்களை அனுமதிக்கிறது மற்றும் ஒன்றுக்கு மேற்பட்ட உருப்படி அதிகமாக இருக்கலாம்.

பல சொற்கள் அதிகமாக இருக்கும் ஒரு சொடுக்கி மெனு விரும்பினால், அதை "பட்டியல்" வகைக்கு மாற்றவும், "தேர்வுகள்" பெட்டியை தேர்வுநீக்கம் செய்யவும்.

20 இல் 08

புதிய பட்டியல் உருப்படிகளைச் சேர்க்கவும்

உங்கள் மெனுவில் புதிய உருப்படிகளை சேர்க்க, "பட்டியல் மதிப்புகள் ..." பொத்தானை சொடுக்கவும். இது மேலே சாளரத்தை திறக்கும். முதல் பெட்டியில் உங்கள் உருப்படி லேபிளில் தட்டச்சு செய்க. இது பக்கத்தில் காட்டப்படும். நீங்கள் மதிப்பு வெற்று விட்டு விட்டால், அது வடிவத்தில் அனுப்பப்படும்.

20 இல் 09

மேலும் சேர்க்கவும் மறுவரிசைப்படுத்தவும்

கூடுதல் உருப்படிகளை சேர்க்க பிளஸ் ஐகானைக் கிளிக் செய்க. பட்டியல் பெட்டியில் அவற்றை மீண்டும் ஆர்டர் செய்ய விரும்பினால், மேல் மற்றும் கீழ் அம்புக்குறிகளைப் பயன்படுத்துக.

20 இல் 10

அனைத்து பொருட்களின் மதிப்புகளையும் கொடுங்கள்

படி 8 ல் குறிப்பிட்டுள்ளபடி, நீங்கள் மதிப்பு வெற்று விட்டு விட்டால், லேபிள் வடிவம் அனுப்பப்படும். ஆனால் உங்கள் அனைத்து மதிப்புகளையும் கொடுக்க முடியும் - உங்கள் படிவத்தில் மாற்று தகவலை அனுப்ப. நீங்கள் இதை ஜம்ப் மெனுக்கள் போன்றவற்றைப் பயன்படுத்தலாம்.

20 இல் 11

இயல்புநிலையைத் தேர்வுசெய்க

வலைப்பக்கங்கள் இயல்புநிலை உருப்படியை முதலில் பட்டியலிடப்பட்டிருந்தால், கீழ்தோன்றும் உருப்படியை காண்பிப்பது இயல்பு. ஆனால் நீங்கள் வேறுபட்ட ஒன்றை தேர்வு செய்தால், அதை "மெனுவில் தேர்ந்தெடுக்கப்பட்ட" பெட்டியில் பண்புகள் தனிப்படுத்தி காட்டுகிறது.

20 இல் 12

வடிவமைப்பு பார்வையில் உங்கள் பட்டியல் பார்க்கவும்

நீங்கள் பண்புகள் திருத்தும் முடிந்ததும், ட்ரீம்வீவர் தேர்ந்தெடுத்த இயல்புநிலை மதிப்புடன் உங்கள் கீழ்தோன்றும் பட்டியலை காண்பிக்கும்.

20 இல் 13

கோட் காட்சியில் உங்கள் பட்டியல் பார்க்கவும்

நீங்கள் குறியீட்டு பார்வையில் மாறினால், ட்ரீம்வீவர் உங்கள் துளி மெனுவை மிக சுத்தமான குறியீடுடன் சேர்க்கும் என்பதைக் காணலாம். ஒரே கூடுதல் பண்புக்கூறுகள் அணுகல்தன்மை விருப்பங்கள் மூலம் நாங்கள் சேர்க்கப்பட்டவை. குறியீடானது அனைத்து பதிவையும் படிக்கவும் புரிந்து கொள்ளவும் மிகவும் எளிதானது. இது XHTML எழுதுவதற்கு இயல்புநிலைக்கு நான் ட்ரீம்வீவருக்குத் தெரிவித்ததால், இது தேர்ந்தெடுக்கப்பட்ட = "தேர்ந்தெடுக்கப்பட்ட" கற்பிதத்தில் கூட வைக்கிறது.

20 இல் 14

சேமித்து உலாவியில் காண்க

ஆவணத்தைச் சேமித்து அதை வலை உலாவியில் பார்வையிட்டால், நீங்கள் எதிர்பார்க்கும் அளவுக்கு உங்கள் துளி மெனு தோன்றும் என்பதை நீங்கள் காணலாம்.

20 இல் 15

ஆனால் அது எதையும் செய்யாது

மேலே நாம் உருவாக்கிய மெனுவானது நன்றாக தோன்றுகிறது, ஆனால் அது எதுவும் செய்யாது. ஏதாவது செய்ய அதை பெற, நீங்கள் வடிவத்தில் தன்னை ஒரு வடிவம் நடவடிக்கை அமைக்க வேண்டும், இது முற்றிலும் மற்ற பயிற்சி உள்ளது.

அதிர்ஷ்டவசமாக, ட்ரீம்வீவர் ஒரு உள்ளமைக்கப்பட்ட கீழ்தோன்றும் மெனு வடிவத்தை கொண்டுள்ளது, இது படிவங்கள், CGI கள் அல்லது ஸ்கிரிப்ட்டிங் பற்றி அறிந்து கொள்ளாமல் உங்கள் தளத்தில் உடனடியாக பயன்படுத்தலாம். இது ஒரு தாவிச் செல்லவும்.

ட்ரீம்வீவர் ஜம்ப் மெனு பெயர்கள் மற்றும் URL களுடன் ஒரு துளி மெனுவை அமைக்கிறது. பின்னர் நீங்கள் ஒரு உருப்படியை மெனுவில் தேர்வு செய்யலாம் மற்றும் நீங்கள் ஒரு இணைப்பை சொடுக்கிவிட்டால், வலைப்பக்கம் அந்த இடத்திற்கு நகரும்.

நுழைவு மெனுவிற்கு சென்று படிவத்தைத் தேர்ந்தெடுத்து, மெனு செல்லவும்.

20 இல் 16

மெனு விண்டோ செல்லவும்

தர மெனுவைப் போலல்லாமல், குளுமை மெனு உங்கள் மெனு உருப்படிகளை பெயரிடவும், படிவம் எவ்வாறு வேலை செய்ய வேண்டும் என்பதை விவரங்களைச் சேர்க்கவும் ஒரு புதிய சாளரத்தை திறக்கிறது.

முதல் உருப்படியை, உரை "untitled1" ஐ நீங்கள் என்ன படிக்க வேண்டும் என்று விரும்புகிறீர்களோ அதையே ஒரு URL ஐ சேர்க்க வேண்டும்.

20 இல் 17

உங்கள் தாவி செல்லவும் மெனுவைச் சேர்க்கவும்

உங்கள் ஜம்ப் மெனுவில் புதிய உருப்படியைச் சேர்க்க, சேர்க்க உருப்படி மீது கிளிக் செய்யவும். நீங்கள் விரும்பினால் பல உருப்படிகளை சேர்க்கவும்.

20 இல் 18

மெனு விருப்பங்கள் செல்லவும்

நீங்கள் விரும்பும் எல்லா இணைப்புகளையும் சேர்த்தவுடன், நீங்கள் உங்கள் விருப்பங்களைத் தேர்வு செய்ய வேண்டும்:

URL ஐ திற

நீங்கள் ஒரு பிரேம்கேட்டை வைத்திருந்தால், வேறு சட்டத்தில் இணைப்புகளைத் திறக்கலாம். அல்லது சாளரத்தை ஒரு புதிய சாளரத்தில் அல்லது மற்ற இடங்களில் திறக்கும் ஒரு முக்கிய இலக்கை முதன்மை சாளரத்தின் விருப்பத்தை மாற்றலாம்.

பட்டி பெயர்

பக்கத்திற்கு உங்கள் மெனு ஒரு தனிப்பட்ட ஐடியை கொடுங்கள். ஸ்கிரிப்ட் சரியாக வேலை செய்வதற்கு இது தேவைப்படுகிறது. இது ஒரு வடிவத்தில் பல ஜம்ப் மெனுக்கள் இருப்பதை அனுமதிக்கிறது - அவற்றை வேறு பெயர்களில் கொடுக்கவும்.

பட்டிக்கு பிறகு பட்டன் போடவும்

மெனுவில் மாற்றங்கள் ஏற்பட்டால் சில நேரங்களில் ஸ்கிரிப்ட் வேலை செய்யாது, ஏனெனில் நான் இதை தேர்ந்தெடுக்க விரும்புகிறேன். இது மேலும் அணுகக்கூடியது.

URL மாற்றத்தின் பின்னர் முதல் உருப்படியைத் தேர்ந்தெடுக்கவும்

முதல் பட்டி உருப்படியை "ஒன்றைத் தேர்ந்தெடுக்கவும்" போன்ற ஒரு வரியில் இருந்தால், இதைத் தேர்ந்தெடுக்கவும். இது அந்த உருப்படி பக்கத்தில் இயல்புநிலையாக இருப்பதை உறுதிப்படுத்துகிறது.

20 இல் 19

பட்டி வடிவமைப்பு காட்சிக்கு செல்லவும்

உங்கள் முதல் மெனுவைப் போலவே, ட்ரீம்வீவர் உங்கள் ஜம்ப் மெனுவையும் வடிவமைப்பு பார்வையில் இயல்புநிலை உருப்படியுடன் காணக்கூடியதாக அமைக்கிறது. நீங்கள் எந்தவொரு மென்பொருளையும் போலவே கீழ்தோன்றும் மெனுவை திருத்தலாம்.

நீங்கள் அதை திருத்தினால், உருப்படிகளில் ஏதேனும் ஐடிகளை மாற்றக்கூடாது என்பதை உறுதிப்படுத்தவும், இல்லையெனில் ஸ்கிரிப்ட் வேலை செய்யாது.

20 ல் 20

உலாவியில் மெனு செல்லவும்

கோப்பு சேமிக்கிறது மற்றும் F12 தாக்கியதால் உங்கள் விருப்பமான உலாவியில் பக்கம் காண்பிக்கும். அங்கு நீங்கள் ஒரு விருப்பத்தை தேர்வு செய்யலாம், "செல்" மற்றும் ஜம்ப் மெனு வேலை செய்யவும்!