தெரிந்த தளம் தெரியாத விஷயங்கள்..
HTML அறிவோம்... (1)
Image -களை நகர வைக்கும் முறைகளைக் கழிந்த பதிவுகளில் பார்த்தோம். இனி, இன்றைய பதிவில், இதுவரை நமது பதிவுகளில் காணாத பல்வேறு முறைகளைப் பற்றிக் காண்போம்.
இது போன்ற முறைகளை அறிவதற்கு HTML, JAVA போன்றவை தெரிந்திருக்க வேண்டும் என்பது அவசியமில்லை.
நாங்கள் எடுத்துரைக்கும் வழி முறைகளைப் பின்பற்றினால் போதும்.
இதற்கு முந்தைய பதிவுகளில், code -களைக் கொடுத்து copy செய்து உங்கள் தளத்தில் paste செய்ய வழி காட்டினேன்.
இவ்வற்றை நாமாக எவ்வாறு உருவாக்குவது எனபது பற்றி என்னவென்று அறிந்து கொள்வோமே...
சாதாரணமாக ஒரு வார்த்தையை அல்லது எழுத்தை நகர வைக்க பயன்படுத்தப் படுவது marquee என்கின்ற குறியீட்டு சொல்லாகும்.
எந்த ஒரு HTML code-ம் ஆரம்பிக்கின்ற வரிகள், < > இந்த இரு அடையாளங்களுக்கு மத்தியில் அமைந்திருக்கும்.
எடுத்துக்காட்டாக,
<marquee>
எந்த ஒரு HTML code-ம் முடிகின்ற வரிகள்,
< >இந்த இரு அடையாளங்களுக்கு மத்தியில் / இந்த குறியீட்டுடன் அமைந்திருக்கும்.
எடுத்துக்காட்டாக,
</marquee>
ஒரு எழுத்தை அல்லது வார்த்தையை மிக எளிதாக நகர்த்த வேண்டும் என்றால்,
மேற்கண்ட தொடக்க மற்றும் முடிவு குறியீடு வார்த்தைகளுக்கு இடையே, உங்களது வார்த்தையை இட வேண்டும்.
எடுத்துக்காட்டாக,
<marquee>உங்களது வார்த்தை</marquee>
இப்போது இதை உங்களது EDIT HTML பகுதியில் இட்டுப் பாருங்கள்.
COMPOSE செய்துப் பார்த்தால், இதன் பிரதிபலிப்பு கீழ்க் கண்டவாறு இருக்கும்.
திசை:
உங்களது வார்த்தை நகரும் திசையை மாற்ற விரும்பினால், direction="" என்பதை உடன் இணைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left">உங்களது வார்த்தை</marquee>
உங்களது வார்த்தை நகரும் திசை வலது புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="right" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="right">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் திசை மேல் புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="up" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="up">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் திசை கீழ் புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="up" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="down">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
வேகம்:
உங்களது வார்த்தை நகரும் வேகத்தை மாற்ற நீங்கள் விரும்பினால், scrollamount="" என்பதை உடன் இணைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
இங்கே உங்களது வார்த்தையின் வேகமானது, scrollamount -ன் மதிப்பைப் பொறுத்து அமைகிறது.
உங்களது வார்த்தை நகரும் வேகத்தை அதிகரிக்க scrollamount="10" என்பதை scrollamount="50" அல்லது scrollamount="100" என்றவாறு அதிகரிக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="50" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் வேகத்தை குறைக்க scrollamount="10" என்பதை scrollamount="5" அல்லது scrollamount="2" என்றவாறு குறைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="2" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
நடத்தை:
நாம் வார்த்தைகளை இங்கே நகர வைப்பதை scroll என்கிறோம்.
நாம் நகர்த்த நினைக்கும் வார்த்தைகளை நகர வைப்பதற்காக, நாம் இடுகின்ற கட்டளை அல்லது வார்த்தையின் நடத்தை scroll ஆகும். எனவே behavior="scroll" என்பதை இங்கே இணைக்க வேண்டும். இவை scroll செய்யும்போது அவசியப்படுவதில்லை. மற்ற கட்டளைகளை உருவாக்கும்போது அவசியமாகிறது.
எடுத்துக்காட்டாக,
<marquee behavior="scroll" direction="left" scrollamount="2" >உங்களது வார்த்தை</marquee>
DIAGONAL SCROLLING
Diagonal Scrolling உருவாக்குவது மிக எளிது.. Diagonal scrolling -ல் மேலே குறிப்பிட்ட scrolling -க்கான codings -ஐ இரண்டு முறை பயன்படுத்தினாலே போதும்.
உதாரணத்திற்காக,
<marquee behavior="scroll" direction="up" scrollamount="2" ><marquee behavior="scroll" direction="right" scrollamount="2" >உங்களது வார்த்தை</marquee></marquee>
இதற்கான பிரதிபலிப்பு
இங்கே உங்களது Diagonal scrolling -கான திசையை மாற்ற விரும்பினால், direction -களை வெவ்வேறாக இட்டுப் பாருங்கள்.
JUMPING
இங்கே உங்களது வார்த்தையானது, Jumping செய்வது போலத் தோன்றும். ஆனால், உண்மையில் அது இடைநிறுத்தப் பணிகளை மேற்கொள்கிறது.
அதாவது உங்கள் வார்த்தை நகரும்போது குறிப்பிட்ட கால இடைவெளியை ஏற்படுத்தி பின்னர், மீண்டும் நகருகிறது.
பொதுவாக நேர இடைவெளியை delay என்கிறோம். இங்கே உங்களது வார்த்தையானது scrolling செய்வதில் இடைவெளியை உண்டாக்குகிறது. எனவே, scrolldelay="" என்பதை இங்கே பயன்படுத்த வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="10" scrolldelay="500" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் நேர இடைவெளிக்கான மதிப்பை அதிகப்படுத்தி மற்றும் குறைத்துப்பாருங்கள்.
BOUNCING
இந்த முறையின் போது, உங்களது வார்த்தையானது இடது மற்றும் வலது புறமாக தொடர்ந்து alternate ஆகிக் கொண்டே இருக்கும். எனவே இங்கே scroll என்ற நடத்தையை தவிர்த்து alternate என்ற நடத்தையை உருவாக்க வேண்டும். அதாவது, behavior="alternate" என்றவாறு அமைத்திட வேண்டும்.
எடுத்துக்காட்டாக,
<marquee behavior="alternate" direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
SLIDING
இந்த முறையின் போது உங்களது வார்த்தையானது slide -ஐ உருவாக வேண்டும். என்பதற்காக, இதற்கான நடத்தையை behavior="slide" என மாற்ற வேண்டும்.
எடுத்துக்காட்டாக,
<marquee behavior="slide" direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
இவை சாத்தியமாகுமா என தோன்றுகிறதா?
நமது தளத்தின் வலது புறம் கொடுக்கப்பட்டுள்ள HTML code Tester -ல் உங்களது code -களை இட்டுப் பாருங்கள்.
உங்களது code -களுக்கு விடை அதன் கீழ்ப் புறம் பிரதிபலிக்கும்..
இந்த பதிவு உங்களுக்கு புடிச்சிருக்கா?
இது போன்ற முறைகளை அறிவதற்கு HTML, JAVA போன்றவை தெரிந்திருக்க வேண்டும் என்பது அவசியமில்லை.
நாங்கள் எடுத்துரைக்கும் வழி முறைகளைப் பின்பற்றினால் போதும்.
இதற்கு முந்தைய பதிவுகளில், code -களைக் கொடுத்து copy செய்து உங்கள் தளத்தில் paste செய்ய வழி காட்டினேன்.
இவ்வற்றை நாமாக எவ்வாறு உருவாக்குவது எனபது பற்றி என்னவென்று அறிந்து கொள்வோமே...
சாதாரணமாக ஒரு வார்த்தையை அல்லது எழுத்தை நகர வைக்க பயன்படுத்தப் படுவது marquee என்கின்ற குறியீட்டு சொல்லாகும்.
எந்த ஒரு HTML code-ம் ஆரம்பிக்கின்ற வரிகள், < > இந்த இரு அடையாளங்களுக்கு மத்தியில் அமைந்திருக்கும்.
எடுத்துக்காட்டாக,
<marquee>
எந்த ஒரு HTML code-ம் முடிகின்ற வரிகள்,
< >இந்த இரு அடையாளங்களுக்கு மத்தியில் / இந்த குறியீட்டுடன் அமைந்திருக்கும்.
எடுத்துக்காட்டாக,
</marquee>
ஒரு எழுத்தை அல்லது வார்த்தையை மிக எளிதாக நகர்த்த வேண்டும் என்றால்,
மேற்கண்ட தொடக்க மற்றும் முடிவு குறியீடு வார்த்தைகளுக்கு இடையே, உங்களது வார்த்தையை இட வேண்டும்.
எடுத்துக்காட்டாக,
<marquee>உங்களது வார்த்தை</marquee>
இப்போது இதை உங்களது EDIT HTML பகுதியில் இட்டுப் பாருங்கள்.
COMPOSE செய்துப் பார்த்தால், இதன் பிரதிபலிப்பு கீழ்க் கண்டவாறு இருக்கும்.
திசை:
உங்களது வார்த்தை நகரும் திசையை மாற்ற விரும்பினால், direction="" என்பதை உடன் இணைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left">உங்களது வார்த்தை</marquee>
உங்களது வார்த்தை நகரும் திசை வலது புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="right" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="right">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் திசை மேல் புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="up" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="up">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் திசை கீழ் புறமாக இருக்க வேண்டும் என நீங்கள் விரும்பினால், direction="left" என்பதை direction="up" என மாற்றி அமைக்கவும்.
எடுத்துக்காட்டாக,
<marquee direction="down">உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
வேகம்:
உங்களது வார்த்தை நகரும் வேகத்தை மாற்ற நீங்கள் விரும்பினால், scrollamount="" என்பதை உடன் இணைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
இங்கே உங்களது வார்த்தையின் வேகமானது, scrollamount -ன் மதிப்பைப் பொறுத்து அமைகிறது.
உங்களது வார்த்தை நகரும் வேகத்தை அதிகரிக்க scrollamount="10" என்பதை scrollamount="50" அல்லது scrollamount="100" என்றவாறு அதிகரிக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="50" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் வேகத்தை குறைக்க scrollamount="10" என்பதை scrollamount="5" அல்லது scrollamount="2" என்றவாறு குறைக்க வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="2" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
நடத்தை:
நாம் வார்த்தைகளை இங்கே நகர வைப்பதை scroll என்கிறோம்.
நாம் நகர்த்த நினைக்கும் வார்த்தைகளை நகர வைப்பதற்காக, நாம் இடுகின்ற கட்டளை அல்லது வார்த்தையின் நடத்தை scroll ஆகும். எனவே behavior="scroll" என்பதை இங்கே இணைக்க வேண்டும். இவை scroll செய்யும்போது அவசியப்படுவதில்லை. மற்ற கட்டளைகளை உருவாக்கும்போது அவசியமாகிறது.
எடுத்துக்காட்டாக,
<marquee behavior="scroll" direction="left" scrollamount="2" >உங்களது வார்த்தை</marquee>
DIAGONAL SCROLLING
Diagonal Scrolling உருவாக்குவது மிக எளிது.. Diagonal scrolling -ல் மேலே குறிப்பிட்ட scrolling -க்கான codings -ஐ இரண்டு முறை பயன்படுத்தினாலே போதும்.
உதாரணத்திற்காக,
<marquee behavior="scroll" direction="up" scrollamount="2" ><marquee behavior="scroll" direction="right" scrollamount="2" >உங்களது வார்த்தை</marquee></marquee>
இதற்கான பிரதிபலிப்பு
இங்கே உங்களது Diagonal scrolling -கான திசையை மாற்ற விரும்பினால், direction -களை வெவ்வேறாக இட்டுப் பாருங்கள்.
JUMPING
இங்கே உங்களது வார்த்தையானது, Jumping செய்வது போலத் தோன்றும். ஆனால், உண்மையில் அது இடைநிறுத்தப் பணிகளை மேற்கொள்கிறது.
அதாவது உங்கள் வார்த்தை நகரும்போது குறிப்பிட்ட கால இடைவெளியை ஏற்படுத்தி பின்னர், மீண்டும் நகருகிறது.
பொதுவாக நேர இடைவெளியை delay என்கிறோம். இங்கே உங்களது வார்த்தையானது scrolling செய்வதில் இடைவெளியை உண்டாக்குகிறது. எனவே, scrolldelay="" என்பதை இங்கே பயன்படுத்த வேண்டும்.
எடுத்துக்காட்டாக,
<marquee direction="left" scrollamount="10" scrolldelay="500" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
உங்களது வார்த்தை நகரும் நேர இடைவெளிக்கான மதிப்பை அதிகப்படுத்தி மற்றும் குறைத்துப்பாருங்கள்.
BOUNCING
இந்த முறையின் போது, உங்களது வார்த்தையானது இடது மற்றும் வலது புறமாக தொடர்ந்து alternate ஆகிக் கொண்டே இருக்கும். எனவே இங்கே scroll என்ற நடத்தையை தவிர்த்து alternate என்ற நடத்தையை உருவாக்க வேண்டும். அதாவது, behavior="alternate" என்றவாறு அமைத்திட வேண்டும்.
எடுத்துக்காட்டாக,
<marquee behavior="alternate" direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
SLIDING
இந்த முறையின் போது உங்களது வார்த்தையானது slide -ஐ உருவாக வேண்டும். என்பதற்காக, இதற்கான நடத்தையை behavior="slide" என மாற்ற வேண்டும்.
எடுத்துக்காட்டாக,
<marquee behavior="slide" direction="left" scrollamount="10" >உங்களது வார்த்தை</marquee>
இதற்கான பிரதிபலிப்பு
இவை சாத்தியமாகுமா என தோன்றுகிறதா?
நமது தளத்தின் வலது புறம் கொடுக்கப்பட்டுள்ள HTML code Tester -ல் உங்களது code -களை இட்டுப் பாருங்கள்.
உங்களது code -களுக்கு விடை அதன் கீழ்ப் புறம் பிரதிபலிக்கும்..
இந்த பதிவு உங்களுக்கு புடிச்சிருக்கா?
0 comments:
Post a Comment