JQuery நூலகம்: உங்கள் வலைத்தளத்தில் ஸ்லைடர்களை

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

எப்படி சேர் என்ற ஒரு ஸ்லைடர் ஒரு வலைப்பக்கத்தில்?

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

உங்களை ஒரு ஸ்லைடர் உருவாக்கவும்: HTML குறியீட்டை உள்ள

முதலாவதாக, எங்கே துவங்குவது - ஸ்லைடர் எதிர்கால அமைப்பை பதிவு செய்ய உள்ளது.

1. எங்கள் அனைத்து ஸ்லைடுகளையும் கொண்டிருக்கும் எச்டிஎம்எல் கோப்பு ஸ்லைடு அலகு, (படங்கள் போன்றவை) நிர்ணயிக்கப்பட்டது.
2. இது ஒவ்வொரு பத்தி ஒரு தனி ஸ்லைடு சேமிப்போம், உல் பட்டியலில் இடுகின்றன.

நாம் CSS சேர்ந்து பணியாற்றுகிறோம்

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

• ஸ்லைடு அலகு வலது கணம் ஸ்லைடு (அல்லது படத்தின் உட்பொருள்) ஆக கூட ஒரே ஒரு காட்டுகிறது என்று, மற்றும் ஓய்வு மறைக்கப்பட்டன உறுதி;
• சரிவுகள் மற்ற (இடமிருந்து வலம்) பின் ஒன்றாக ஏற்பாடு;
• அசையும் (இடது மற்றும் வலது) சரிவுகள் சேமித்தும் வைக்கிறது உல்-கொள்கலன் தொடர்பு கொள்ளமுடியும்.

இதை செய்ய, அமைக்க CSS கோப்பு பின்வரும் விருப்பங்கள்:

• எஸ்: வழிதல்-X - உருட்டும், கூடுதல் உருப்படி-Y - மறைத்து:
• உல் க்கான: மிதவை - விட்டு.

மேலும் நீ முன்னும் பின்னுமாக அகலம் அளவுருக்கள் (அகலம்), உயரம் (உயரம்), பின்னணி (பின்னணி) மற்றும் அமைக்க முடியும்.

நாம் jQuery இந்த குறியீடு வைத்து

HTML மற்றும் CSS தேவையான அனைத்து மாற்றங்கள் மேற்கொள்ளப்பட்டுள்ளன. இது பின்வரும் காரணிகள் வேண்டும் இது jQuery குறியீடு, ஸ்லைடர்களை, வழக்கு இருக்கும்:

• ஸ்லைடுகளை ஒரு குறிப்பிட்ட நேரம் இடைவெளியில் ஒருவருக்குப் பின் வேண்டும்;
• நீங்கள் படல் போது மீது சுட்டியை சுட்டிக்காட்டி தங்கள் இயக்கம் நிறுத்திக் கொள்ளவேண்டும்.

slidewidth மற்றும் slidertime (ஸ்லைடு நீளம் சமமாக) (ஸ்லைடு ஷோ காலம் தீர்மானிக்கிறது): இதை செய்ய, நாம் இரண்டு மாறிகள் அறிவிக்க. பக்கம் முழுமையாக ஏற்றப்படும் தளத்தில் இருக்கும் போது டைமர் ஆரம்பிக்கும். இந்த அளவுரு மூலம் நாம் (ஸ்லைடு ஷோ நிறுத்தப்படும் இது) ஒரு ஸ்லைடு சுட்டியை சுட்டிக்காட்டி நடவடிக்கை கட்ட.

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

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

முடிவுக்கு

இந்த கட்டுரையில் நாம் அதன் வலைத்தளத்தில் ஒரு பக்கம் புகுத்துவதற்கு தங்கள் சொந்த jQuery-ஸ்லைடர்களை உருவாக்க எப்படி பார்த்து. ஒரு எளிய ஸ்லைடர் உதாரணம் உதவியுடன், உங்களுக்குப் அது தங்கள் விளக்கம் கொண்டு source code இனை தேவையான மாற்றங்களை செய்து வரலாம். இந்த வடிவமைப்பு மேம்படுத்த மற்றும் பார்வையாளர்கள் உங்கள் தளத்தில் பயன்படுத்த வசதியான செய்யும்.