script.aculo.us - विज़ुअल इफेक्ट्स

Script.aculo.us प्रभावों को दो समूहों में विभाजित किया गया है -

कोर प्रभाव

निम्नलिखित छह मुख्य प्रभाव script.aculo.us विज़ुअल इफेक्ट्स जावास्क्रिप्ट लाइब्रेरी की नींव हैं।

Effect.Opacity
Effect.Scale
Effect.Morph
Effect.Move
Effect.Highlight
Effect.Parallel

सभी मुख्य प्रभाव विभिन्न सामान्य मापदंडों के साथ-साथ प्रभाव-विशिष्ट मापदंडों का समर्थन करते हैं और ये प्रभाव नाम केस-संवेदी होते हैं।

इस ट्यूटोरियल में सभी प्रभाव-विशिष्ट कॉमन पैरामीटर्स पर प्रभावों के साथ चर्चा की गई है।

संयोजन प्रभाव

सभी संयोजन प्रभाव पांच कोर प्रभावों पर आधारित होते हैं, और उदाहरण के रूप में सोचा जाता है कि आप अपने स्वयं के प्रभाव को लिखने की अनुमति दें।

आमतौर पर ये प्रभाव अन्य प्रभावों के समानांतर, सिंक्रनाइज़ निष्पादन पर निर्भर करते हैं। ऐसा निष्पादन आसानी से उपलब्ध है, इसलिए अपने स्वयं के संयुक्त प्रभाव बनाना बहुत आसान है। यहाँ संयोजन प्रभाव की एक सूची है -

Effect.Appear
Effect.Fade
Effect.Puff
Effect.DropOut
Effect.Shake
Effect.SwitchOff
Effect.BlindDown
Effect.BlindUp
Effect.SlideDown
Effect.SlideUp
Effect.Pulsate
Effect.Squish
Effect.Fold
Effect.Grow
Effect.Shrink

इसके अतिरिक्त, वहाँ है Effect.toggle उन तत्वों के लिए उपयोगिता विधि जिन्हें आप अस्थायी रूप से एक अपील / फीका, स्लाइड या ब्लाइंड एनीमेशन के साथ दिखाना चाहते हैं।

Effect.toggle

लाइब्रेरी फ़ाइलें प्रभाव के लिए आवश्यक हैं

Script.aculo.us की प्रभाव क्षमताओं का उपयोग करने के लिए, आपको प्रभाव मॉड्यूल को लोड करना होगा। तो, script.aculo.us के लिए आपकी न्यूनतम लोडिंग इस तरह दिखाई देगी:

<html>
   <head>
      <title>script.aculo.us effects</title>
      <script type = "text/javascript"  src = "/javascript/prototype.js"></script>
      <script type = "text/javascript"  src = "/javascript/"effects.j"></script>
   </head>
	
   <body>
      ...
   </body>
</html>

कॉल प्रभाव कार्य

मुख्य प्रभाव शुरू करने का उचित तरीका आमतौर पर है newऑपरेटर। अपनी प्राथमिकताओं के आधार पर, आप दो वाक्यविन्यासों में से एक का उपयोग कर सकते हैं -

वाक्य - विन्यास

new Effect.EffectName(element [, requiredArgs ] [ , options ] )
OR
element.visualEffect('EffectName' [, requiredArgs ] [,options])

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

उदाहरण

यहां दो समतुल्य कॉल हैं, ताकि आप देख सकें कि वाक्यविन्यास कैसे संबंधित हैं, जो बहुत अधिक विनिमेय हैं -

new Effect.Scale('title', 200, { scaleY: false, scaleContent: false });
OR
$('title' ).visualEffect('Scale', 200, { scaleY:false, scaleContent:false });