आज वेब मा "सबै भन्दा राम्रो" प्रविधिहरु मध्ये एक parallax स्क्रॉल हो। हामी सबै उन साइटहरूमा छौँ जहाँ तपाइँ आफ्नो माउसमा स्क्रोल व्हील घुमाउनुहोस् र पृष्ठमा भएको सामग्री माथि र तल वा पृष्ठमा घुमाउनुहुन्छ जब तपाईँले माउस व्हील घुमाउनुहुन्छ।
वेब डिजाइन र ग्राफिक डिजाइनमा भएका नयाँहरूको लागि, यो प्रविधि आवश्यक सीएसएस को मात्राको कारण प्राप्त गर्न गाह्रो हुन सक्छ।
यदि यसले तपाइँलाई वर्णन गर्दछ भने, केही अनुप्रयोगहरू छन् जुन केवल ग्राफिक कलाकारहरूमा अपील हुन सक्छ। तिनीहरू मूलतया वेब पेजहरूमा एक परिचित पृष्ठ लेआउट दृष्टिकोण प्रयोग गर्छन्, जसको अर्थ त्यहाँ धेरै छैन, यदि कुनै हो, कोडिङ समावेश छ। एक अनुप्रयोग जसले वास्तवमा प्रचारमा चकलेट गरेको छ Adobe Muse।
ग्राफिक्स द्वारा काम गरिरहेको काम द्वारा Muse को उपयोग गरेर धेरै अद्भुत छ र तपाईं दिन को संग्रहालय साइट मा गएर तपाईं के गर्न सक्नुहुनेछ को नमूना देख सकते हो। यद्यपी वेब प्रविधिको केही प्रकारका "हाई-माथिको खिलौने" को रूपमा म्युजिकको सम्बन्ध राख्ने गरिन्छ, यो मोबाइल र वेब प्रोटोटाइपहरू सिर्जना गर्न डिजाइनरहरूले पनि प्रयोग गरेको छ जुन अन्ततः उनीहरूको टोलीमा विकासकर्ताहरूलाई हस्तान्तरण गरिनेछ।
एक प्रविधि जो कि अविश्वसनीय रूपमा सजिलो हो कि फाईल पाल्लाक्स स्क्रोलिङ हो र यो हो भने, यदि तपाइँ व्यायामको पूर्ण संस्करण हेर्न चाहानुहुन्छ हामी हिँड्नु हुनेछ, यस ब्राउजरमा यो ब्राउजर बिन्दु हुनेछ। जब तपाईं आफ्नो माउसको स्क्रिन व्हील रोल गर्नुहुन्छ, पाठ पृष्ठ माथि माथि वा तल सार्न र छविहरू परिवर्तन गर्न लाग््छ।
सुरू गरौं।
01 को 07
वेब पेज सिर्जना गर्नुहोस्
जब तपाईं लिपि लन्च गर्नुहुनेछ नयाँ साइट लिङ्क। यसले नयाँ साइट गुण खोल्नेछ। यो परियोजना डेस्कटप अनुप्रयोगको लागि डिजाइन गरिनेछ र तपाईँले यसलाई प्रारम्भिक लेआउट पप-डाउन मेनुमा चयन गर्न सक्नुहुनेछ। तपाईं स्तम्भहरू, गटर चौडाई, मार्ग र प्याडिङको संख्याका लागि मानहरू सेट गर्न सक्नुहुन्छ। यस अवस्थामा, हामी धेरैसँग सम्बन्धित चिन्तित थिएनौं र केवल ठीक क्लिक गर्नुहोस्।
02 को 07
पृष्ठ ढाँचा गर्नुहोस्
जब तपाइँ साइट गुणहरू सेट गर्नुहुन्छ र क्लिक गर्नुभयो ठीक छ तपाईँले यसलाई योजना दृश्य भनिन्छ भन्ने लागिएको थियो। त्यहाँ माथिको होम पेज र सञ्झ्यालको तल्लोमा मास्टर पेज हो । हामी केवल एउटा पृष्ठ चाहिन्छ। डिजाइन दृश्यमा प्राप्त गर्न, हामीले होम पेजमा डबल-क्लिक गर्यौं जुन इन्टरफेस खोलियो।
बाँयामा केहि आधारभूत उपकरणहरू छन् र दाँयामा प्यानलहरू पृष्ठमा सामग्री हेरफेर गर्न प्रयोग गरिन्छ। माथिको गुणहरू हो, जुन पृष्ठमा लागू गर्न सकिन्छ, वा पृष्ठमा चयन गरिएको केहि पनि। यस अवस्थामा, हामी कालो पृष्ठभूमि चाहियो। यो पूरा गर्न हामी ब्राउजर भरिएको रंगीन चिपमा क्लिक गर्दछौं र रङ्ग पिकरबाट कालो चयन गर्दछौं।
03 को 07
पृष्ठमा पाठ थप्नुहोस्
अर्को चरण पृष्ठमा केही पाठ थप्न हो। हामीले पाठ उपकरण चयन गर्यौं र पाठ बक्स बाहिर निकाल्नुभयो। हामीले "स्वागत" शब्द प्रविष्ट गर्यौं र, गुणमा पाठ एरिड, 120 पिक्सेलको सेतोमा सेट गर्छौं । केन्द्र पङ्क्तिबद्ध
त्यसपछि हामी चयन उपकरणमा स्विच गर्नुभयो, पाठ बाकसमा क्लिक गर्नुहोस् र माथिबाट 168 पिक्सलमा यसको वाईको स्थिति सेट गर्नुहोस्। पाठ बक्सको साथ अझै पनि चयन गरियो, हामीले पङ्क्ति पङ्क्ति खोल्न र पाठ बक्सलाई केन्द्रमा मिलाउछौं।
अन्तमा, पाठ बाकस चयन गरी, हामी विकल्प / Alt र Shift कुञ्जीहरू तल राख्नुभयो र पाठ बक्सको चार प्रतिमा बनाउनुभयो। हामीले पाठ परिवर्तन गर्यौं र प्रत्येक प्रतिलिपिको वाईको स्थितिमा:
- To, 871
- ग्राफिक्स, 1621
- सफ्टवेयर, 2371
- @ About.com, 3181
तपाईंले ध्यान दिनुहुनेछ, प्रत्येक पाठ बक्सको स्थान सेट गर्दा, पृष्ठले पाठको स्थान समायोजन गर्न रमाइलो गर्दछ।
04 को 07
छवि प्लेसहोल्डरहरू थप्नुहोस्
अर्को चरण पाठ ब्लक बीच छविहरू राख्नु हो।
पहिलो चरण आयत उपकरण चयन गर्न र हाम्रो बक्स जुन पृष्ठको एक छेउबाट अर्कोतिर फैल्छ। आयताकार चयन गरी, हामी यसको उचाई 250 पिक्सल र यसको Y स्थिति 425 पिक्सल सम्म सेट गर्छौं। यो प्रयोगकर्ताले तिनीहरूलाई सधैँ फैलाउन वा पृष्ठ चौडाइलाई अनुगमन गर्नको लागि प्रयोगकर्ताको ब्राउजर भ्युपोर्ट समायोजन गर्नु पर्छ। यसलाई पूरा गर्न हामीले गुणमा 100% चौडाई बटन क्लिक गर्यौ। के यो एक्स एक्स ग्रे ग्रे बाहिर छ र निश्चित रूपमा ब्राउजरमा भिजुअल चौडाइको छवि 100% सुनिश्चित गर्न सुनिश्चित गर्दछ।
05 को 07
छवि प्लेसहोल्डरमा छविहरू थप्नुहोस्
आयतले चयन गरेको साथमा हामीले भरिएको लिंक क्लिक गर्यौं - रङ चिप होइन - र आयतमा छवि थप्नका लागि म्यूज मसी क्लिक गर्नुभयो। फिटिंग क्षेत्रमा, हामीले स्केल फिट चयन गर्यौं र छवि क्षेत्रमा छवि ह्यान्डल क्लिक गर्नु भएको छवि छविको केन्द्रबाट स्केल गरिएको छ।
अर्को, हामीले पहिलो दुई पाठ ब्लकहरू बीच छविको प्रतिलिपि बनाउन विकल्प / Alt-Shift-drag technique प्रयोग गर्यौं, भरिएको प्यानल खोलियो र छविलाई अर्कोको लागि बदलीयो। हामीले यो दुईवटा बाँकी तस्बिरहरूको लागि पनि गर्नुभयो।
तस्विरको साथमा, गति थप्न समय हो।
06 को 07
पैलेक्स स्क्रोलिङ थप्नुहोस्
Adobe Muse मा पार्लाक्स स्क्रोलिङ थप गर्ने तरिकाहरू छन्। हामी तपाईंलाई यो सरल तरीका देखाउन जाँदैछौं।
भरिएको प्यानल खोल्नुहोस्, स्क्रोल ट्याबमा क्लिक गर्नुहोस् र, जब यसले खोल्छ, मोशन चेकबक्समा क्लिक गर्नुहोस्।
तपाईंले प्रारम्भिक र अन्तिम गतिको लागि मूल्यहरू देख्नुहुनेछ। यो निर्धारित गर्नुहोस् कि छवि स्क्रोल व्हील सम्बन्धमा कसरी चाँडो हुन्छ। उदाहरणको लागि, 1.5 को एक मानले पहिया भन्दा 1.5 पटक छिटो छवि सार्दछ। छविहरू लक गर्न हामीले 0 को एक मान प्रयोग गर्यौं।
तेर्सो र ठाडो तीर गतिको दिशा निर्धारण गर्दछ। यदि मानहरू 0 हो भने छविहरू कुन बायाँमा क्लिक गर्नुहुने बाधा नपाउनेछन्।
बीचको मूल्य - कुञ्जी स्थिति - छविहरू जहाँ सुरू गर्न सुरु हुने कुरा देखाउँछ। छवि माथिको रेखा यो सुरु हुन्छ, पृष्ठको शीर्षबाट 325 पिक्सल। जब स्क्रॉलमा पुग्छ त्यो छविमा छवि सार्न सुरु हुन्छ। तपाईले यो मूल्यलाई संवाद बाकसमा वा परिवर्तन गरेर वा माथिको वा माथिको शीर्षमा बिन्दु क्लिक गरेर यो परिवर्तन गर्न सक्नुहुन्छ।
पृष्ठमा अन्य तस्बिरहरूको लागि यो दोहोर्याउनुहोस्।
07 को 07
ब्राउजर परीक्षण
यस समयमा, हामी समाप्त भयो। पहिलो कुरा हामीले गर्नुभयो, स्पष्ट कारणहरूका लागि, फाईल> सुरक्षित साइट चयन गर्न थाल्नुभयो। ब्राउजर परीक्षणमा, हामीले ब्राउजरमा फाइल> पूर्वावलोकन पृष्ठ मात्र चयन गर्यौँ। यसले हाम्रो कम्प्युटरको पूर्वनिर्धारित ब्राउजर खोल्यो र, पृष्ठ खोलिएको बेला हामीले स्क्रॉल गर्न थालें।