मुझे इस तरह jquery accordion स्क्रिप्ट है ..
& lt; script type = 'text / जावास्क्रिप्ट '& gt; $ (Document) .ready (function () {$ ('div.Syb & gt; div')। Hide (); $ ('div.Syb & gt; h4') क्लिक करें (फ़ंक्शन () {$ (this) .next 'Div')। स्लाइड टॉगल ('तेज')। साइबिंग ('div: दृश्य')। स्लाइडअप ('तेज');});}); & Lt; / स्क्रिप्ट & gt;
मुझे डिव .. से पहले + और - प्रतीक दिखाना होगा, यह दिखाने के लिए कि इसकी विस्तारित और ढह गई है ..
मैं इसे कैसे कर सकता हूं। >
यदि आप इंटरनेट एक्सप्लोरर 7 या उससे कम के बारे में परेशान नहीं हैं, तो आप इसे सीएसएस में कर सकते हैं, जो कि यह आदर्श होना चाहिए (जैसा कि यह प्रस्तुति है, सामग्री नहीं):
div.Syb & gt; Div: पहले {content: '+'; } Div.Syb & gt; Div.hidden: {content से पहले: '-'; }
या आप पृष्ठभूमि की छवियों के साथ खेल सकते हैं।
फिर बस अपने कोड को देने के लिए बस toggleclass ()
का उपयोग करें। छुपा वर्ग ।
यदि आप इसे सीधा ऊपर jQuery में करना चाहते हैं, तो आपको शायद अपना मार्कअप थोड़ा बदलना होगा:
& lt; div class = "syb" & gt ; & Lt; h4 & gt; & lt; span & gt; + & lt; / span & gt; शीर्षक एक & lt; / h4 & gt; & Lt; div id = "एक" & gt; पाठ & lt; / div & gt; & Lt; h4 & gt; & lt; span & gt; + & lt; / span & gt; शीर्षक दो & lt; / h4 & gt; & Lt; div id = "दो" & gt; पाठ & lt; / div & gt; & Lt; h4 & gt; & lt; span & gt; + & lt; / span & gt; शीर्षक तीन & lt; / h4 & gt; & Lt; div id = "three" & gt; पाठ & lt; / div & gt; & Lt; / div & gt;
तब आप बस अपने jQuery को इस प्रकार बदल सकते हैं:
& lt; script type = 'text / javascript' & gt; $ (Document) .ready (function () {$ ('div.Syb & gt; div')। Hide (); $ ('div.Syb & gt; h4') क्लिक करें (फ़ंक्शन () {var span = $ (this) ('Span: first'); span.text (span.text () == '+'? '-': '+'); $ (यह) .next ('div')। स्लाइडटॉगल ('उपवास ')। साइबिंग्स (' div: दृश्य ')। स्लाइडअप (' तेज ');});}); & Lt; / स्क्रिप्ट & gt;
Comments
Post a Comment