JQuery पर छवि गैलरी। दिलचस्प प्रभाव jquery गैलरी पूर्ण स्क्रीन के साथ jQuery में छवि गैलरी

लंबन स्लाइडर

लंबन स्लाइडर मैनुअल कंट्रोल के साथ स्लाइड शो के रूप में छवियों के प्रदर्शन के आयोजन के लिए एक दिलचस्प समाधान। चित्रों के थंबनेल के मूल स्थान को आकर्षित करता है। आधिकारिक वेबसाइट में स्लाइडर को एकीकृत और कॉन्फ़िगर करने के लिए एक पूर्ण लेआउट है।

JQuery के साथ न्यूनतम स्लाइड शो गैलरी स्वचालित छवि परिवर्तन के तत्वों के साथ छवियों की एक उत्कृष्ट गैलरी, साथ ही थंबनेल के ग्रिड के साथ ड्रॉप-डाउन ब्लॉक से छवियों के प्रदर्शन और चयन को मैन्युअल रूप से नियंत्रित करने की क्षमता है। Minuses में से, हम पूर्ण-पैमाने की छवियों को देखने की कमी को नोट कर सकते हैं, लेकिन यह इस गैलरी की अतिसूक्ष्मवाद है।

यह एक पूर्ण-स्क्रीन स्लाइड शो है जिसमें स्वचालित रूप से चित्र बदलते हैं, कोई मन-उड़ाने वाला प्रभाव नहीं है, सब कुछ सरल और स्वादिष्ट है।

न्यूनतम गैलरीछवि बदलावों के एक बड़े चयन के साथ एक उच्च अनुकूलन योग्य jQuery प्लगइन है। मिनिमिट गैलरी की सहायता से, आप एक हिंडोला, स्लाइड शो, एक साधारण रोटेटर और एक साधारण चित्र फ़्लिपिंग के रूप में छवियों के प्रदर्शन को व्यवस्थित कर सकते हैं।

एक छोटा (2kb) jQuery प्लगइन है जो स्लाइड शो के रूप में छवियों को प्रदर्शित करने के लिए एक सरल, बिना बकवास तरीका प्रदान करता है।

सहज ज्ञान युक्त नियंत्रण और सभी कंप्यूटर, iPhones और मोबाइल उपकरणों पर निर्दोष संगतता के साथ एक अच्छी दिखने वाली जावास्क्रिप्ट गैलरी है। स्थापित करने और कॉन्फ़िगर करने के लिए बहुत आसान है

कई जावास्क्रिप्ट और jQuery छवि स्लाइडर्स के विपरीत, Slider.js एक हाइब्रिड समाधान, कुशल CSS3 संक्रमण और एनीमेशन आधारित है।

यह HTML5 और CSS3 में विभिन्न प्रस्तुतियाँ बनाने के लिए एक पृष्ठ का खाका है।

Diapo स्लाइड शो एक ओपन सोर्स प्रोजेक्ट है। आप चाहें तो बदलाव या सुधार का सुझाव दे सकते हैं। आप इसे मुफ्त में डाउनलोड और उपयोग कर सकते हैं, कुछ भी नहीं और कोई भी इस स्लाइडर को अपनी परियोजनाओं में उपयोग करने के लिए परेशान नहीं करता है। स्लाइडर आसानी से अनुकूलन योग्य है, प्रस्तुत सामग्री के बीच दिलचस्प बदलाव, और आप स्लाइडर में कुछ भी रख सकते हैं, यह बहुत तेजी से काम करता है, बिना किसी जाम के।

वेबसाइटों और अन्य वेब परियोजनाओं पर स्लाइडशो बनाने के लिए एक और उपकरण से ज्यादा कुछ नहीं है। सभी आधुनिक ब्राउज़रों द्वारा समर्थित, क्षैतिज और ऊर्ध्वाधर एनीमेशन, कस्टम संक्रमण के लिए समर्थन, कॉलबैक एपीआई, और बहुत कुछ। आप स्लाइड्स में किसी भी html एलिमेंट्स का उपयोग कर सकते हैं, शुरुआती के लिए समझने योग्य और पहुंच योग्य, पूरी तरह से मुफ्त वितरित।

चंचल विकास के लिए जावास्क्रिप्ट स्लाइड शो

इस भयानक jQuery प्लगइन के साथ अपने स्लाइडशो को लागू करें। एक उच्च अनुकूलन उपकरण ताकि आप अपनी आवश्यकताओं के अनुसार अपनी सामग्री प्रस्तुति का निर्माण कर सकें। एक डेटा प्रारूप का उपयोग आपके सीएमएस से बाहरी डेटा या डेटा के साथ आसान एकीकरण प्रदान करने के लिए किया जाता है। यह एक नया संस्करण है और इसे स्क्रैच से लिखा गया है। डेवलपर्स ने अपने दिमाग की उपज के साथ काम करने की पूरी प्रक्रिया का वर्णन बहुत स्पष्ट और समझदारी से करने की कोशिश की है।

- jQuery प्लगइन जो आपको अनियंत्रित सूचियों को आकर्षक एनीमेशन प्रभाव के साथ स्लाइडशो में परिवर्तित करने की अनुमति देता है। एक स्लाइड शो में, आप स्लाइड की एक सूची प्रदर्शित कर सकते हैं, या तो संख्याओं या थंबनेल का उपयोग कर सकते हैं, या पिछले और अगले बटन का उपयोग कर सकते हैं। स्लाइडर में कई मूल एनीमेशन प्रकार हैं, जिसमें क्यूब (विभिन्न उप-प्रजाति के साथ), पाइप, ब्लॉक और बहुत कुछ शामिल हैं।

अपनी वेब परियोजनाओं पर विभिन्न सामग्री की सभी प्रकार की प्रस्तुतियों के आयोजन के लिए उपकरणों का एक पूरा सेट। बुर्जुआ लोगों ने अपना सर्वश्रेष्ठ प्रदर्शन किया, क्लिप में शामिल किया, लगभग सभी प्रकार के विभिन्न स्लाइडर्स और दीर्घाओं में jQuery के जादू का उपयोग किया। फोटो स्लाइडर, फोटो गैलरी, गतिशील स्लाइड शो, हिंडोला, सामग्री स्लाइडर, टैब मेनू और बहुत कुछ, सामान्य तौर पर, एक जगह है जहां हमारी अपरिवर्तनीय कल्पना घूम सकती है।

यह एक jQuery स्लाइड शो प्लगइन है जो मन में सादगी के साथ बनाया गया है। शुरुआती और उन्नत डेवलपर्स दोनों के लिए केवल सबसे उपयोगी कार्यों के साथ पैक किया गया है, जो सरल बनाने की क्षमता प्रदान करता है, लेकिन साथ ही साथ बहुत प्रभावी स्लाइडशो भी है जो उपयोगकर्ता के अनुकूल हैं।

- इस तरह के एक साधारण स्लाइडर को jQuery पर बनाया गया है, सभी मामलों में सरल है, विशेष कौशल की आवश्यकता नहीं है, मुझे लगता है कि कई अपनी साइटों पर स्लाइडशो के कार्यान्वयन के लिए काम में आएंगे। प्लगइन को धीमी आईई सहित सभी आधुनिक ब्राउज़रों में परीक्षण किया गया है।

jbgallery एक प्रकार का यूजर इंटरफेस विजेट है जिसे jQuery लाइब्रेरी की जावास्क्रिप्ट में लिखा जाता है। इसका कार्य एक बड़ी छवि को फ़ुल-स्क्रीन मोड में साइट की पृष्ठभूमि के रूप में दिखाना है, कई चित्र स्लाइडर के रूप में। सभी व्यू मोड में व्यू कंट्रोल होते हैं। अपने तरीके से एक दिलचस्प समाधान, जहां यह मानक भी नहीं है।

यह छवियों के बीच संक्रमण प्रभाव (देखा और अधिक दिलचस्प) के साथ अपनी तस्वीरों को स्लाइड शो के रूप में प्रदर्शित करने के लिए उपयोग में आसान jQuery प्लगइन है। jqFancyTransitions सफारी 2+, इंटरनेट एक्सप्लोरर 6+, फ़ायरफ़ॉक्स 2+, Google क्रोम 3+, ओपेरा 9+ के साथ संगत और बड़े पैमाने पर परीक्षण किया गया है।

"लाइटबॉक्स" के रूप में छवियों और किसी भी अन्य जानकारी को देखने के लिए एक निशुल्क jQuery प्लगइन है। नियंत्रण के साथ पॉपअप, छायांकित पृष्ठभूमि और सभी, सरल और स्वादिष्ट।

लाइटबॉक्स श्रृंखला से एक और jQuery प्लगइन, हालांकि यह एक अपमानजनक तरीके (9 KB) में वजन करता है, जबकि इसके साथ काम करने के लिए संभावनाओं का एक गुच्छा है। एक शालीनता से डिज़ाइन किया गया इंटरफ़ेस है जिसे आप हमेशा सीएसएस के साथ सुधार या अनुकूलित कर सकते हैं।

नाम से पहले से ही यह स्पष्ट हो जाता है कि फैंसी कुछ भी नहीं है, हमारे पास एक बहुत ही सरल स्वचालित छवि स्कोरर है, जिसमें पूरी तरह से अनुपस्थित नियंत्रण है। कौन जानता है, शायद सिर्फ इसके अतिसूक्ष्मवाद से, यह स्लाइडर आपका ध्यान आकर्षित करेगा।

विभिन्न प्रकार के संक्रमणों के साथ छवि रोटेटर। यह स्वचालित मोड में और क्लिक पर दोनों काम करता है, इसे काफी आसानी से कॉन्फ़िगर किया गया है।

- एक स्लाइडर के बजाय एक पूर्ण छवि गैलरी। थंबनेल पूर्वावलोकन और संक्रमण प्रभाव को चुनने की क्षमता, सभी ब्राउज़रों के लिए पूर्ण समर्थन, एक वेब परियोजना में एकीकरण का एक विस्तृत विवरण और मुफ्त वितरण।

यह स्क्रिप्टैकुलस / प्रोटोटाइप या jQuery का उपयोग करके रेडी-टू-यूज़ स्लाइडशो का कार्यान्वयन है। होरिंजा एक तरह का अभिनव समाधान है, क्योंकि यह आपको स्लाइडर में रखी गई सामग्री के माध्यम से स्क्रॉल करने के लिए पहिया का उपयोग करने की अनुमति देता है। जब माउस पॉइंटर स्लाइड शो क्षेत्र के बाहर होता है, तो परिवर्तन स्वचालित रूप से होता है, जब पॉइंटर को स्लाइड शो के ऊपर रखा जाता है, स्क्रॉल करना बंद हो जाता है।

सरलतम छवि स्क्रॉलरों की एक श्रृंखला से एक चिप, हालांकि देखने के नियंत्रण की उपस्थिति के साथ, स्वचालित और मैनुअल दोनों मोड में काम करती है।

s3Slider - jQuery प्लगइन, छवियों की एक अनियंत्रित सूची से एक स्लाइड शो बनाता है और किसी भी वेब साइट पर आसानी से लागू किया जा सकता है।

यह एक jQuery प्लगइन है जो बैंडविड्थ को संरक्षित करते हुए बड़ी मात्रा में फ़ोटो को संभालने के लिए अनुकूलित है।

वेगास पृष्ठभूमि

वेगास बैकग्राउंड jQuery प्लगइन आपको अपने वेब पेजों में सुंदर पूर्ण स्क्रीन पृष्ठभूमि छवियों को जोड़ने की अनुमति देता है, सभी स्लाइड शो तत्वों के साथ। यदि आप ध्यान से प्लगइन के साथ काम करने की जटिलताओं का अध्ययन करते हैं, तो आप कई दिलचस्प समाधान पा सकते हैं, निश्चित रूप से, यदि केवल आपको इसकी आवश्यकता है।

- स्लाइडर के रूप में एक स्लाइडर, "टाइपिंग" विधि का उपयोग करते हुए, लेखों और सरल नियंत्रणों की छवियों या घोषणाओं के लिए कैप्शन के साथ, कोई और अधिक नहीं, कम नहीं।

छवि देखने के आयोजन के लिए एक हल्का (लगभग 5 KB) जावास्क्रिप्ट है। बड़ी छवियों के स्वचालित आकार और स्केलिंग, आपको ब्राउज़र विंडो के भीतर पूर्ण आकार में चित्र देखने की अनुमति देता है

PikaChoose jQuery की छवि गैलरी संस्करण 4 उपलब्ध है! Pikachoose शानदार फीचर्स वाला एक हल्का jQuery का स्लाइड शो है! फैंसीबॉक्स के साथ एकीकरण, महान थीम (हालांकि मुफ्त नहीं) और बहुत कुछ प्लगइन डेवलपर्स द्वारा पेश किया जाता है।

आपकी सूची में छवियों की संख्या की जाँच करता है और गतिशील रूप से डिजिटल नेविगेशन के रूप में फोटो लिंक का एक सेट बनाता है। इसके अलावा, प्रत्येक छवि पर क्लिक करने से आगे या पीछे की ओर बढ़ जाएगा, और आप चित्र पर क्लिक के क्षेत्र के आधार पर छवियों के माध्यम से भी फ्लिप कर सकते हैं (उदाहरण के लिए: तस्वीर के बाईं ओर क्लिक करके स्लाइड को आगे और पीछे क्रमशः छवि के दाईं ओर स्थानांतरित किया जाएगा)।

एक और jQuery स्लाइडर जो किसी भी वर्डप्रेस टेम्पलेट में पूरी तरह से फिट बैठता है।

"निवो" का एक और विकास, जैसे कि इस स्टूडियो के लोग जो कुछ भी करते हैं, प्लग-इन उच्च गुणवत्ता के साथ किया जाता है, इसमें 16 अद्वितीय संक्रमण प्रभाव, कीबोर्ड नेविगेशन और बहुत कुछ शामिल हैं। इस संस्करण में सीधे वर्डप्रेस के लिए एक समर्पित प्लगइन शामिल है। तो इस ब्लॉगिंग इंजन के सभी प्रशंसकों के लिए, नीवो स्लाइडर विषय के लिए सिर्फ सही होगा।

jQuery प्लगइन जो आपको किसी भी आकार की छवियों के लिए एक सरल, प्रभावी और सुंदर स्लाइडर बनाने की अनुमति देता है।

Piroboxएक हल्का jQuery "लाइटबॉक्स" स्क्रिप्ट है, देखने को एक पॉप-अप ब्लॉक में किया जाता है जो सभी नियंत्रणों के साथ स्वचालित रूप से छवि के आकार को समायोजित करता है।

इस गैलरी के निर्माता चित्रों की काफी मूल प्रस्तुति प्रदान करते हैं। छवियों को एक लहर के रूप में थंबनेल के रूप में प्रदर्शित किया जाता है, जब आप थंबनेल पर क्लिक करते हैं, तो हम चित्र के एक मध्यम आकार के संस्करण पर विचार करेंगे, दूसरी बार क्लिक करें और आपके पास एक बड़ी छवि होगी। आप इसे एक प्रयोग मान सकते हैं, लेकिन आपको यह स्वीकार करना चाहिए कि कुछ नया और असामान्य हमेशा दिलचस्प होता है।

HTML5 और jQuery के साथ पूर्ण स्क्रीन स्लाइड शो

स्लाइडशो बनाने और पूर्ण स्क्रीन मोड में चित्रों को प्रदर्शित करने के लिए, डेवलपर्स ने पहले से परिचित वेगास jQuery प्लगइन का उपयोग किया, जिसमें समूह के लेखों में पहले से वर्णित कई विचार और तकनीक शामिल हैं। एचटीएमएल 5 ऑडियो तत्वों की उपस्थिति और छवियों के बीच संक्रमण के निष्पादन की शैली से आकर्षित।

कोड्रोप्स टीम का एक और विकास, एक पूर्ण विकसित और कार्यात्मक छवि गैलरी, हालांकि, इसका वर्णन करने में क्या बात है, आपको इसे देखना होगा।

चित्र स्लाइड शो, चित्र आपकी आंखों के सामने गायब हो जाते हैं, प्रभाव अद्भुत है।

JQuery लाइब्रेरी के शीर्ष पर बनी छवि गैलरी के लिए एक जावास्क्रिप्ट ढांचा है। लक्ष्य वेब और मोबाइल उपकरणों के लिए एक पेशेवर छवि गैलरी विकसित करने की प्रक्रिया को सरल बनाना है। पॉप-अप विंडो और पूर्ण स्क्रीन मोड में देखने की संभावना।

चुपचाप, हम उपयोग करने के लिए शुरू करते हैं और कोड्रॉप्स टीम से नए कार्यों की प्रतीक्षा करते हैं। पूर्ण स्क्रीन मोड में चित्रों को देखने के लिए एक महान 3 डी संक्रमण प्रभाव के साथ एक महान चित्र स्लाइडर प्राप्त करें।

स्लाइड शो आयोजकों की श्रृंखला में एक और वर्डप्रेस प्लगइन। आसानी से लगभग किसी भी डिजाइन में एकीकृत होता है और उन्नत उपयोगकर्ताओं के साथ-साथ अनुभवहीन लोगों के लिए कई अनुकूलन विकल्प प्रदान करता है।

वर्डप्रेस के लिए लिखा गया एक अन्य प्लगइन आपके ब्लॉग पर चित्रों या किसी अन्य सामग्री के स्लाइडशो को व्यवस्थित करना बहुत आसान बना देगा।

WordPress एकीकरण के लिए अच्छा स्लाइड शो प्लगइन। Xili-floom-slideshow स्वचालित रूप से स्थापित किया गया है, और व्यक्तिगत सेटिंग्स की भी अनुमति है।

Slimbox2 "लाइटबॉक्स" प्रभाव के साथ छवियों को प्रदर्शित करने के लिए एक अच्छी तरह से स्थापित वर्डप्रेस प्लगइन है। ब्राउज़र विंडो में स्वचालित स्लाइड शो और छवि का समर्थन करता है। वैसे भी, इस प्लगइन को इस श्रृंखला में अन्य प्लगइन्स के कई फायदे हैं।

यह प्लगइन, विजेट आपको अपनी वर्डप्रेस वेबसाइट या ब्लॉग के लिए गतिशील, प्रबंधनीय स्लाइडशो और प्रस्तुतियाँ बनाने की अनुमति देता है

यह वर्डप्रेस प्लगइन गैलरी-एम्बेडेड छवियों को एक सरल और लचीले स्लाइड शो में परिवर्तित करता है। प्लगइन FlexSlider jQuery छवि स्लाइडर और उपयोगकर्ता की व्यक्तिगत प्राथमिकताओं का उपयोग करता है।

फोटो स्लाइड शो के आयोजन के लिए एक वर्डप्रेस प्लगइन है, SmugMug, Flickr, MobileMe, Picasa या Photobucket RSS फ़ीड की छवियां, शुद्ध जावास्क्रिप्ट के साथ काम करता है और प्रदर्शित करता है।

वर्डप्रेस और अधिक के लिए इस तरह एक साधारण स्लाइडर। शानदार और बोझिल कुछ भी नहीं है, काम न्यूनतम शैली में किया जाता है, स्थिरता और गति पर जोर दिया जाता है, यह पूरी तरह से ब्लॉग प्रबंधन इंजन से जुड़ता है।

मेरी राय में स्किटर सबसे अच्छे वर्डप्रेस स्लाइडर्स में से एक है। यह स्थिरता और काम की गति को आकर्षित करता है, न कि प्रमुख नियंत्रण, संक्रमण प्रभाव और विषय के लिए काफी सरल कनेक्शन।

वर्डप्रेस के लिए एक प्लगइन है, जिसके साथ आप आसानी से और जल्दी से अपनी साइट पर छवियों की एक गैलरी को स्लाइड शो मोड में देखने की क्षमता के साथ व्यवस्थित कर सकते हैं। डिस्प्ले स्वचालित रूप से या थम्बनेल डिस्प्ले और इमेज कैप्शन के साथ पूरी तरह से नियंत्रित हो सकता है।

Of.Website | डेमो

एक स्लाइड शो के रूप में एक पोस्ट / पृष्ठ के लिए सभी चित्रों को दिखाता है। सरल प्रतिष्ठापन। इस प्लगइन को संक्रमण एनीमेशन के साथ संस्करण के लिए एडोब फ्लैश की आवश्यकता है, अगर फ्लैश नहीं मिला है तो स्लाइडर सामान्य रूप से काम करता है।

एक और सरल वर्डप्रेस स्लाइडर जो पोस्ट छवियों और लघु लेख पूर्वावलोकन दिखाता है। मैं समय-समय पर इस ब्लॉग पर सिर्फ ऐसे प्लगइन का उपयोग करता हूं।

उल्का स्लाइड एक jQuery के वर्डप्रेस स्लाइडर है जिसमें से चुनने के लिए बीस से अधिक संक्रमण शैली हैं। लेखक ने प्लग-इन "उल्का" कहा, शायद काम की गति को लागू करना, शायद मुझे उल्का के बारे में कुछ भी ध्यान नहीं था।

oQey गैलरी वर्डप्रेस के लिए स्लाइड शो तत्वों के साथ एम्बेडेड वीडियो और संगीत क्षमताओं के साथ एक पूर्ण छवि गैलरी है।

यह एक स्लाइड शो है जिसमें वेबसाइटों और ब्लॉगों पर चित्र और वीडियो देखने के लिए फ्लैश एनीमेशन तत्व हैं। आप इस स्लाइडर को किसी भी वेबसाइट पर रख सकते हैं, इसे किसी भी आकार में और किसी भी सामग्री को पसंद कर सकते हैं।

फ्लैश गैलरी प्लगइन आपकी नियमित दीर्घाओं को आश्चर्यजनक छवि दीवारों में बदल देता है, प्रति पोस्ट कई एल्बमों के लिए समर्थन, पूर्ण स्क्रीन पूर्वावलोकन और स्लाइड शो मोड।

वाह स्लाइडर अद्भुत दृश्यों (विस्फोट, मक्खी, अंधा, चौकों, स्लाइस, बेस, फीका, ढेर, ऊर्ध्वाधर ढेर और रैखिक) के साथ वर्डप्रेस के लिए एक jQuery छवि स्लाइडर है और पेशेवर रूप से डिज़ाइन किए गए टेम्पलेट हैं।

प्रमोशन स्लाइडर एक jQuery प्लगइन है जो एक साधारण स्लाइड शो को जैज़ करना आसान बनाता है, या पृष्ठ पर घूर्णन विज्ञापनों के कई ज़ोनों को लागू करता है, क्योंकि यह एक उच्च अनुकूलन योग्य उपकरण है, स्लाइडर में दिखाए गए और मॉड्यूल कैसे काम करता है, इस पर आपका पूरा नियंत्रण होगा। आम तौर पर।

| डेमो

संस्करण 2.4 में नया: सीधे वर्डप्रेस संपादक के माध्यम से तस्वीरों के ड्रैग-एन-ड्रॉप छंटाई के लिए समर्थन, साथ ही मुख्य छवियों में फोटो लिंक जोड़ने की क्षमता। (IE8 में कीड़े हो सकते हैं, सभी प्रमुख ब्राउज़रों में ठीक काम करता है। लेखक भविष्य में IE8 के लिए पूर्ण समर्थन का वादा करते हैं।)

| डेमो

इस समीक्षा का अंतिम राग यह वर्डप्रेस प्लगइन होगा, छवियों को चुनने और बदलने के लिए दिलचस्प दृश्य प्रभावों के साथ एक और स्लाइडर।

मैं उपरोक्त सभी को देखता हूं और मैं चकित हूं कि यह मानव लोगों के लिए कल्पना की उड़ान होनी चाहिए, और यह सब नहीं है कि वेब प्रोजेक्ट्स पर छवियों को व्यवस्थित करने के विषय पर हाल ही में वेब डेवलपरों ने ढेर कर दिया है। यह बहुत अच्छा है कि अब जीवन के लिए दीर्घाओं और स्लाइडशो बनाने के लिए इस तरह के महान समाधान लाना संभव है।
मैं चुपचाप यह उम्मीद करता हूं कि इस संग्रह में आप अपने लिए कुछ दिलचस्प पाएंगे, अपनी खुद की, अनोखी गैलरी या स्लाइडर को बंद कर सकते हैं, अपने उपयोगकर्ताओं की खुशी के लिए और निश्चित रूप से, अपने आप को, अपने प्रिय को, लेकिन इसके बिना कहां ...

दिमित्री सेमेनोव द्वारा
एक jQuery छवि गैलरी और सामग्री स्लाइडर प्लगइन है। यह पूरी तरह से उत्तरदायी, स्पर्श के अनुकूल है और मॉड्यूलर वास्तुकला है जो आपको केवल उन विशेषताओं को शामिल करने की अनुमति देता है जो आपको फ़ाइल आकार और प्रदर्शन को अनुकूलित करने की आवश्यकता है।

एंडी द्वारा - द कॉफ़ीस्क्रिप्ट
JQuery के लिए एक उच्च अनुकूलन गैलरी / शोकेस प्लगइन।

ट्रेंट द्वारा
गैलेरिफ़िक एक jQuery प्लगइन है जो बैंडविड्थ का संरक्षण करते हुए फ़ोटो के उच्च संस्करणों को संभालने के लिए एक समृद्ध, पोस्ट-बैक मुक्त अनुभव प्रदान करता है।

टॉनिक गैलरी - jQuery XML पोर्टफोलियो गैलरी | $ 6

ऐनो द्वारा
गैलेरिया एक जावास्क्रिप्ट छवि गैलरी फ्रेमवर्क है जो jQuery लाइब्रेरी के शीर्ष पर बनाया गया है। उद्देश्य वेब और मोबाइल उपकरणों के लिए पेशेवर छवि दीर्घाओं के निर्माण की प्रक्रिया को सरल बनाना है।

कैचमफ्रेम द्वारा
दूसरे दिन मैं एक पृष्ठ पर छवियों के एक सेट के बीच फीका करने के लिए jQuery का उपयोग करते हुए एक सरल तरीका ढूंढ रहा था। इसलिए, एक कोडर होने के नाते, मैंने अपना स्वयं का प्लगइन बनाने के लिए सेट किया।

थॉमस कहन द्वारा
स्मूथ डिवा स्क्रॉल एक jQuery प्लगइन है जो सामग्री को क्षैतिज रूप से बाएं या दाएं स्क्रॉल करता है। JQuery के लिए लिखे गए कई अन्य स्क्रॉलिंग प्लग इन के अलावा, स्मूथ डिवा स्क्रॉल स्क्रॉल को अलग-अलग चरणों तक सीमित नहीं करता है।

विक्टर Zambrano द्वारा - frwrd.net
AJAX द्वारा संचालित Minishowcase एक छोटी और सरल php / जावास्क्रिप्ट ऑनलाइन फोटो गैलरी है, जो आपको जटिल डेटाबेस या कोडिंग के बिना आसानी से अपनी छवियों को ऑनलाइन दिखाने की अनुमति देता है, कुछ ही मिनटों में एक अप-एंड-रनिंग गैलरी की अनुमति देता है।

कैस्पर डेविड फ्रेडरिक द्वारा
EOGallery एक वेब एनिमेटेड स्लाइड शो गैलरी है जिसे jQuery के साथ बनाया गया है। यह केवल बड़े चित्रों को प्रदर्शित करने के लिए बुनियादी jQuery फ़ंक्शंस और कोडी लिंडले के थिकबॉक्स का उपयोग करता है।

अरनॉल्ट पचोट द्वारा
JQuery के लिए एक बहु-प्रारूप का हिंडोला, कई मीडिया का समर्थन करने वाला नॉन ऑब्स्ट्रक्टिव और सुलभ पोर्टफोलियो: फोटो, वीडियो (flv), ऑडियो (एमपी)। JQuery के लिए यह प्लगइन स्वचालित रूप से प्रत्येक मीडिया के विस्तार का पता लगाएगा और अनुकूलित खिलाड़ी को लागू करेगा।

दीवार - मीडिया गैलरी - jQuery संचालित | $ 5

स्टीफन पेट्रे द्वारा
अंतरिक्ष प्रभाव के साथ एक और छवि गैलरी प्लगइन, बहुत हल्का और सरल प्लगइन।

मोरेनो डी डोमेनिको द्वारा
jmFullWall एक प्रभावशाली पोर्टफोलियो के निर्माण के लिए एक jQuery प्लगइन है।

फेब्रीज़ियो काल्डेरन द्वारा
मोसैकी ओपेरा 9+, फ़ायरफ़ॉक्स 3.6+, सफारी 3.2+, क्रोम और IE7 + पर काम करने वाले फोटो को देखने और ज़ूम करने के लिए एक jQuery प्लगइन है। तस्वीरें JSON / JSONP डेटा संरचना से पुनर्प्राप्त की जाती हैं और बेतरतीब ढंग से ग्रिड के अंदर ले जाया जाता है। सीपीयू ओवरहेड को कम से कम करके CSS3 संक्रमणों का उपयोग करके हाल के ब्राउज़रों पर आपके GPU द्वारा सभी महंगी एनिमेशन ली गई हैं।

कोड़ी द्वारा
निम्नलिखित jQuery प्लगइन कई विकल्पों के साथ छवियों के एक सेट को एक छोटी गैलरी में बदल देता है। माइक्रो इमेज गैलरी एक ग्रिड दृश्य के बीच स्विच करने की अनुमति देती है जो छवियों के पूर्वावलोकन को थंबनेल के रूप में दिखाती है और एक एकल दृश्य केवल एक छवि दिखाती है।

VION - jQuery छवि गैलरी प्लगइन | $ 7

मालीहू द्वारा
JQuery फ्रेमवर्क और कुछ सरल CSS के साथ बनाई गई एक सरल, अभी तक सुरुचिपूर्ण फुलस्क्रीन छवि गैलरी।

नमस्कार प्रिय पाठकों ए! इस ट्यूटोरियल में, मैं आपको दिखाऊंगा कि कैसे एक न्यूनतर अभी तक आरामदायक और कार्यात्मक बनाया जा सकता है jQuery पर फोटो गैलरी, या छवियों की एक गैलरी, जैसा कि आप चाहते हैं। गैलरी में श्रेणियां बनाने की क्षमता है, इसके बाद फ़िल्टरिंग की जाती है। स्लाइड शो लॉन्च करना भी संभव है। गैलरी सभी ब्राउज़रों में काम करती है, इसलिए अनुकूलन के साथ कोई समस्या नहीं होगी।

इस गैलरी को बनाने के लिए दो मुफ्त पुस्तकालयों का उपयोग किया जाएगा: quicksandतथा सुंदर तस्वीर... वे गैलरी बनाने के लिए बहुत आसान बनाते हैं। हमेशा की तरह, आप डेमो पेज पर काम का परिणाम देख सकते हैं, साथ ही साथ वर्किंग गैलरी और सभी स्रोत फ़ाइलों से संग्रह डाउनलोड कर सकते हैं। एकमात्र दोष, अगर मैं ऐसा कह सकता हूं, तो बड़ी छवियों के लिए थंबनेल का मैनुअल निर्माण है। अन्यथा, यह गेलरी ध्यान देने योग्य। बिलकुल इसके जैसा !

HTML मार्कअप

सबसे पहले, आइए श्रेणियों की एक सूची के साथ पैनल पर एक नज़र डालें, यह एक बुलेटेड सूची उल है। इसके अलावा, सूची के प्रत्येक तत्व का एक विशिष्ट वर्ग नाम होना चाहिए।

1 2 3 4 5 6 7 8 9 10 11

छवि का नाम प्रकाशित: २०१२

जैसा कि ऊपर कहा गया है, सूची आइटम गैलरी में चित्र हैं। सूची के प्रत्येक तत्व में यौगिक शामिल हैं। यह छवि ही है, या इसके थंबनेल, साथ ही साथ एक विवरण भी है। थंबनेल मुख्य छवि का एक लिंक है। जावास्क्रिप्ट को संलग्न करने और मुख्य छवि को खोलने के लिए रिले विशेषता की आवश्यकता होती है।

2 महत्वपूर्ण चीजों के बारे में भी मत भूलना, डेटा-आईडी विशेषता ली सूची तत्व के लिए अद्वितीय होनी चाहिए। डेटा-प्रकार की विशेषता में श्रेणी वर्ग शामिल है, जिसकी सूची मैंने ऊपर वर्णित की है। यह मार्कअप के बारे में है।

सीएसएस शैलियाँ

मैं शैलियों पर ध्यान केंद्रित नहीं करूंगा, क्योंकि हम एक तैयार पुस्तकालय का उपयोग कर रहे हैं सुंदर तस्वीर, जो छवि को बढ़ाने के लिए जिम्मेदार है, और बहुत सी सीएसएस कोड है। हालांकि, यह ध्यान देने योग्य है कि बढ़े हुए चित्र के डिजाइन के लिए 5 विकल्प हैं, हालांकि आदर्श रूप से केवल 3, चूंकि दो विकल्पों में केवल गोलाई को हटा दिया जाता है।

इसलिए, मैं केवल सीएसएस शैलियों को थंबनेल और श्रेणियों की सूची दिखाऊंगा।

सिद्धांत रूप में, शैलियों के साथ सब कुछ स्पष्ट होना चाहिए। श्रेणियों को लाइन अप करने के लिए, डिस्प्ले प्रॉपर्टी को इनलाइन पर सेट किया जाता है। छवि को एक स्ट्रोक का प्रभाव देने के लिए, पृष्ठभूमि का रंग (सफेद) और 10 पिक्सल का इंडेंट सेट करें। सूची आइटम्स का आकार .portfolio- क्षेत्र ली में सेट किया गया है।

jQuery

और अंत में, सबसे महत्वपूर्ण बात, फिर पूरे पाठ के लिए। यह jQuery कोड है। आइए श्रेणी के अनुसार छवियों को फ़िल्टर करके शुरू करें।

क्लोन () पद्धति और चयनकर्ता का उपयोग करते हुए, हम .portfolio- क्षेत्र के सभी बच्चों का चयन करते हैं और उन्हें $ डेटा चर में लिखते हैं। अगला, हम श्रेणियों में से एक पर क्लिक को ट्रैक करते हैं, .पोर्ट-श्रेणी श्रेणी के साथ सूची में ली तत्व। हम सभी श्रेणियों को निष्कासन को हटाकर निष्कासित कर देते हैं ("सक्रिय"), यदि ऐसा नहीं किया जाता है तो समय के साथ सभी श्रेणियां सक्रिय हो जाएंगी और फ़िल्टरिंग बंद हो जाएगी।

चूँकि हम सूची मद पर क्लिक करते हैं, चयनकर्ता इसमें सूची मद शामिल है, अर्थात, हम इसमें से वर्ग की विशेषता का मान लेते हैं और वर्ग नाम को कई भागों में विभाजित करने के लिए विभाजन विधि का उपयोग करते हैं, सीमा एक स्थान है (अर्थात, यदि वर्ग था " सभी सक्रिय "तो विभाजन के बाद हमें" सभी "और" सक्रिय "की एक सरणी मिलती है)। और फिर, स्लाइस विधि का उपयोग करके, हम सरणी के पहले तत्व (हमारे मामले में, "सभी") का चयन करते हैं, और परिणामी परिणाम को फ़िल्टरक्लास चर में लिखते हैं। अगर जगह नहीं होती तो क्लास का नाम नहीं बदलता।

अगला, हम जाँचते हैं कि फ़िल्टरक्लास चर में स्ट्रिंग है या नहीं सब, फिर .find विधि का उपयोग करते हुए, हम उन सभी वस्तुओं का चयन करते हैं, जिनके बारे में हमने ऊपर चर्चा की $ डेटा सरणी से वर्ग पोर्टफोलियो-आइटम 2 के साथ। चयनित तत्व (और ये सूची के सभी तत्व हैं, अर्थात्, सभी चित्र) फ़िल्टरडैट चर में रखे गए हैं।

अन्यथा, यदि फ़िल्टरक्लास समान नहीं है सब, तब चर फ़िल्टरडैट में हम सूची के सभी तत्वों को नहीं रखेंगे, लेकिन केवल वे हैं जिनके डेटा-प्रकार की विशेषता श्रेणी वर्ग से मेल खाती है। संक्षेप में, आइटम केवल एक श्रेणी के होते हैं।

और अंत में, हम परिणामी चर को पुस्तकालय में स्थानांतरित करते हैं jquery quicksand, जो छवियों को फ़िल्टर करता है। यह सब फ़िल्टरिंग के बारे में है।

अब पॉपअप में छवि के विस्तार के लिए। यहां सब कुछ बहुत सरल है।

एक क्लिक पर एक लिंक पर नज़र रखी जाती है, जिसकी rel विशेषता prettyPhoto से शुरू होती है। फिर लाइब्रेरी चलन में आती है सुंदर तस्वीरऔर छवि चमत्कारिक रूप से बढ़ी हुई है। वैसे, हम कुछ मापदंडों में भी पास होते हैं। जैसे एनीमेशन गति - तेज, स्लाइड शो देरी - 5 सेकंड, फेसबुक थीम (चित्र / सुंदर फोटो फ़ोल्डर में कुल 5 विषय हैं), साथ ही चित्र का नाम प्रदर्शित करने और माउस होवर पर ज़ूम करने पर भी प्रतिबंध है। के लिए पूर्ण प्रलेखन सुंदर तस्वीर पाया जा सकता है

नवीनतम लेखों और पाठों से अपडेट रहने के लिए सदस्यता लें

लंबे समय तक मैंने आज के विषय के लिए एक विषय चुना। नतीजतन, मैंने देखा कि हमने अभी तक चयन नहीं किया है छवि दीर्घाओं... मेरी राय में, एक महान विषय, के बाद से दीर्घाओं कई साइटों पर मौजूद हैं। ईमानदार होने के लिए, वे सभी बहुत आकर्षक नहीं हैं। वर्तमान विकास प्रवृत्तियों को ध्यान में रखते हुए jquery, html5 और इसी तरह। मैंने सोचा कि समाधान उन लोगों की तुलना में पहले से ही अधिक आकर्षक होना चाहिए, जिनका मैंने पहले सामना किया है। इसलिए। एक दिन बिताने के बाद, मैं बड़ी संख्या में स्क्रिप्ट खोजने में कामयाब रहा। इस पूरे पहाड़ से, मैंने केवल चयन करने का फैसला किया, क्योंकि मैं प्यार करता हूं, जैसा कि आप पिछले पोस्टों से देख चुके हैं।
छवि गैलरी न केवल मामले में लागू फोटो एलबम के साथ... स्क्रिप्ट का उपयोग किया जा सकता है, मुझे लगता है कि यह और भी सही होगा, जैसा कि फोटोग्राफरों, डिजाइनरों के लिए पोर्टफोलियो आदि। जक्वेरी प्रभाव आगंतुकों का ध्यान खींचने और आपकी वेबसाइट पर लालित्य जोड़ने में मदद करेगा।
इसलिए। अपने ध्यान संग्रह के लिए वेबसाइट के लिए jquery छवि गैलरी प्लगइन्स.
टिप्पणी करना और याद रखना मत भूलना, ताकि इस संग्रह को न खोएं, आप इसे लेख के निचले भाग में स्टार पर क्लिक करके अपने पसंदीदा में जोड़ सकते हैं।

Photobox

एस गैलरी

DIAMONDS.JS

Superbox

चिकनी विकर्ण फीका गैलरी

गामा गैलरी

विस्तार के दृश्य के साथ थंबनेल ग्रिड

jGallery

Glisse.js

मोज़ेक प्रवाह

Galereya

least.js

flipLightBox

ब्लिंप गैलरी