2008 दिसम्बर 25, 2008

गतिशील लोड हो रहा है JavaScripts

कभी कभी pageweight कम रखने के लिए ... हम हमारे लिपियों टुकड़ों में विभाजित है ... ये जावास्क्रिप्ट टुकड़े के रूप में लोड किया जा सकता है और जब आवश्यक (एक घटना पर या एक लिंक या बटन आदि पर क्लिक करें).

लोड हो रहा है javascripts गतिशील सरल और सुंदर आगे के रूप में नीचे सीधे है ...

= “text/javascript” > <स्क्रिप्ट प्रकार = "पाठ / जावास्क्रिप्ट">
समारोह loadNewScript (स्रोत) {
var = document.createElement ('स्क्रिप्ट');
s.setAttribute ('प्रकार', 'पाठ / जावास्क्रिप्ट');
s.setAttribute ('"', स्रोत);
document.body.appendChild ();
}
</ Script>

आप निम्न कॉल लिंक शरीर में कहीं भी कर सकते हैं या आप स्वयं दस्तावेज़ के इस स्क्रिप्ट "onload" हो सकता है ...

= “javascript:loadNewScript('myDynamicScript.js');” >Load Dynamic Script</ a > <A href = "जावास्क्रिप्ट: loadNewScript के ('myDynamicScript.js);"> लोड गतिशील स्क्रिप्ट </ a>

या

प्रिंट onload="loadNewScript('myDynamicScript.js');">


2008 दिसम्बर 17, 2008

IE8 के गलत व्यवहार: सीएसएस लेआउट टूट - फूट (IE8 में मेटा टैग का उपयोग कर एक ब्राउज़र संस्करण का लक्ष्य निर्धारण)

यदि आप सीएसएस व्यक्ति हैं, आप अपने पार ब्राउज़र काम कर रहे लेआउट में दर्द पता होगा. IE8 अभी तक हमें डेवलपर्स के लिए काम करता है में एक और औजार है. Anywaz! अगर आप इस मुद्दे पर मारा, जैसे मैंने कल, जहां IE7 में पूरी तरह से काम सीएसएस (पहले और) और फ़ायरफ़ॉक्स अचानक IE8 में गुस्सा फेंकने शुरू कर दिया है, यह कोशिश ... यह अच्छी तरह से पल के लिए मेरी समस्याओं को ठीक करने के लिए लग रहा था ....

मेटा घोषणा का उपयोग करना, हम प्रतिपादन इंजन हम IE8 का उपयोग करना चाहते हैं निर्दिष्ट कर सकते हैं. तो IE8 IE7 के रूप में प्रस्तुत करने के लिए मजबूर करने के लिए ... आपके दस्तावेज़ के सिर में निम्नलिखित मेटा टैग सम्मिलित करें:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

डिफ़ॉल्ट रूप से आईई मेटा होगा: -

<meta http-equiv="X-UA-Compatible" content="IE=8" />
जो करना होगा IE8 पृष्ठ नए मानक मोड का उपयोग कर प्रस्तुत करना.

यदि आवश्यक हो, इस वाक्य रचना के लिए अन्य ब्राउज़रों के लिए नीचे के रूप में समायोजित किया जा सकता है:

<meta http-equiv="X-UA-Compatible" content="IE=8;FF=3;OtherUA=4" />


DOCTYPES के बारे में:

अगर आप अभी तक कर रहे हैं जानवर की तरह "Doctype" कहा जाता है के साथ अपरिचित ... यहाँ है कुछ त्वरित पढ़ने के
DOCTYPES क्या हैं? ब्राउज़र quirks और सख्त मोड क्या हैं?
XSL में DOCTYPE स्थापना

DOCTYPES के बारे में गहराई से समझने में अधिक के लिए, इन कड़ियों का दौरा करने की कोशिश ...
एक के अलावा सूची: आपकी साइट सही DOCTYPE के साथ फिक्स!
DOCTYPE परे: एक के अलावा सूची वेब मानक, फॉरवर्ड संगतता, और IE8

नोट: हालांकि हम में से कई HTML / सीएसएस के लोगों को हमारे दस्तावेज़ों में किया गया है टैग decleration के महत्व की उपेक्षा, सही DOCTYPE स्थापना, आमतौर पर सबसे पार ब्राउज़र मुद्दों का जवाब है.


2008 9 दिसंबर 2008

पृष्ठन MooTools का उपयोग करने के साथ सरल हिंडोला

Carousels, वहाँ से बाहर के रूप में अच्छी तरह से MooTools के लिए कई की एक किस्म के साथ, मैं अभी भी मेरे खुद हिंडोला क्लास लिखने के कुछ अच्छे कारणों के लिए, का फैसला किया
1. पेजिंग (सुविधा के लिए एक विशेष / हिंडोला में स्लाइड कदम कूद करने में सक्षम हो) करना चाहता था.
2. बाएँ और दाएँ बटन / लिंक के स्थान के साथ स्वतंत्रता चाहते थे, जहां कभी मैं कृपया.
3. स्लाइड कदम पर अधिक नियंत्रण.

मैं ऊपर सुविधाओं के साथ एक नया हिंडोला, बनाने का प्रबंधन किया ... नीचे के रूप में किसी भी संशोधनों आप की आवश्यकता होती है! सुझाव के लिए स्वतंत्र महसूस करो!!

मेरे उदाहरण ... [इस तरह दिखता है देखें डेमो ]
पृष्ठन के साथ MooTools हिंडोला

डेमो देखें | पृष्ठन संस्करण 1.0 के साथ डाउनलोड MooTools हिंडोला (1990 बार डाउनलोड)


1. हिंडोला पृष्ठन

आप आसानी से अपने हिंडोला पृष्ठन जोड़ सकते हैं, पृष्ठन झंडा, जो आखरी पारित कर दिया जबकि सच करने के लिए MooCarousel के उदाहरण बनाने parater है (पृष्ठन करना चाहते हैं) या झूठी (donot पृष्ठन चाहते हैं) की स्थापना के द्वारा बस.

carousel1 var = नई MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright, c_ns, c_sss, सच); / / एन एस = स्लाइड्स की संख्या, एसएसएस स्लाइड = कदम आकार

और आप बिल्कुल अपने सीएसएस संशोधित करके देखो इन पृष्ठन achors के पता लग रहा है के रूप में आप बदल सकते हैं.

. Carousel_paging {पाठ संरेखित: सही; मार्जिन: 10px 5px 0 0;}
Carousel_paging वर्तमान carousel_paging {पृष्ठ रूपरेखा: चौड़ाई: कोई नहीं;. 15px; ऊँचाई: 15px; रेखा से ऊँचाई: 15px; पाठ संरेखित: केंद्र; प्रदर्शन: ब्लॉक; फ्लोट: छोड़ दिया; पृष्ठभूमि: D8D8EB # मार्जिन: 0 1px 0 0, पाठ - सजावट: कोई नहीं;}

एक carousel_paging: मंडराना, carousel_paging वर्तमान {पृष्ठभूमि # 4D4D9B:, रंग: # FFFFFF ;).

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

2. वाम और सही प्रतीक Customising

तुम बस सीएसएस के साथ खेलने के आसपास प्लेसमेंट, इमेजेज या वामपंथियों और सही बटन के किसी भी displat संपत्ति बदल सकते हैं. बाएँ और दाएँ buttoms की नियुक्तियों को बदलने में सक्षम होना सही मेरे हमारे हिंडोला कक्षा मेरे लिए वास्तविक कारण था.
चूंकि इस MooCarousel क्लास, स्वीकार आईडी इन बटनों में से है, तो आप वास्तव में ये बटन कहीं भी जगह कर सकते हैं पृष्ठ पर, अगर आप कृपया ... यह तत्व पदानुक्रम में होना जरूरी नहीं है, मेरे उदाहरण के रूप में.

var carousel1 = नई MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright, c_ns, c_sss, सच);

सीएसएस
Carousel_container_l, carousel_container_r {मार्जिन: 50px 0 0 0; स्थिति: रिश्तेदार, चौड़ाई: 23px; ऊँचाई: 20px; फ्लोट: छोड़ा; कर्सर: सूचक;}

Carousel_container_r {पृष्ठभूमि - स्थिति: 0-38px;}

{पृष्ठभूमि - स्थिति: 0-58px;} carousel_container_l

3. स्लाइड कदम Customising

मैं क्या मेरा CUSTOMISING स्लाइड क्रम मतलब है?
हाल Carousels दिखाई खिड़की के साथ पूर्ण स्लाइड. तो कहना है कि आप चार वस्तुओं (जैसे मेरे ऊपर नमूना में) था, यह सभी चार आइटम स्लाइड होगा. इस हिंडोला घटक के साथ, आप स्लाइड्स की संख्या और अपनी पसंद के कदम आकार गुजरती हैं.

var carousel1 = नई MooCarousel ('carousel1_wrapper', 'carousel1_items_container', 'carousel1_moveleft', 'carousel1_moveright, c_ns, c_sss, सच);
c_ns = स्लाइड्स की संख्या, c_sss स्लाइड = कदम आकार

इसके अलावा, मेरे example1 में मैं स्लाइड कदम आकार calcuted जहां तर्क के आधार पर, मैं आइटम्स की संख्या, प्रत्येक आइटम पर चौड़ाई और हाशिये कि मेरे सीएसएस में प्रत्येक आइटम के बाद दिया है पता है.

/ 1 सुरापानोत्सव के लिए * /

var = c1_w 92, / / ​​सुरापानोत्सव आइटम चौड़ाई

var c1_n = 10; तुलना सुरापानोत्सव आइटम की / / कुल संख्या

var c1_pp = तुलना सुरापानोत्सव आइटम perpage की संख्या 4 / /

var c1_marginFactor 51 =;

/ / एसएसएस स्लाइड कदम आकार =; var c1_sss = c1_w * c1_pp

var c1_ns = parseInt (((c1_w *) c1_n / c1_sss) + 0.5); / / एन एस = की संख्या स्लाइड

c1_sss + = c1_marginFactor, / / ​​एसएसएस = स्लाइड कदम आकार, हाशिये के लिए 51


आवश्यकताएँ: 1.2 MooTools

डेमो देखें | पृष्ठन संस्करण 1.0 के साथ डाउनलोड MooTools हिंडोला (1990 बार डाउनलोड)


2008 2 दिसंबर 2008

MooTools के लिए सरल क्रॉस ब्राउज़र रेटिंग के स्क्रिप्ट

MooRating पाठ्यक्रम के एक सरल (पार ब्राउज़र, के रूप में यह MooTools पुस्तकालय की शक्ति का उपयोग करता है) हल्के, और उत्कृष्ट MooTools दर्ज़ा समाधान आधारित. यह 'स्टार रेटिंग' के रूप में नहीं करार दिया जाता है, सिर्फ इसलिए कि, रेटिंग छवि के रूप में आप चुनते हो सकता है (मैं सितारे, बार्स और दिल डाउनलोड के साथ उपलब्ध कराई है, लेकिन आप अपने खुद के विभिन्न प्रकार बनाने के लिए और सिर्फ यह में ड्रॉप कर सकते हैं).

यह कैसे की तरह लग रहा है:

अलग छवियों के साथ MooTools रेटिंग डेमो देखें
प्रतिशत मान के साथ MooTools रेटिंग डेमो देखें
भिन्नात्मक मूल्यों के साथ MooTools रेटिंग डेमो देखें

डाउनलोड Mootols सितारा रेटिंग स्क्रिप्ट (718 बार डाउनलोड)

रेटिंग डेटा पूरी संख्या, दशमलव या प्रतिशत:
वर्तमान में स्क्रिप्ट के लिए पूरे (1,2,3,4,5) दशमलव में, मान (1.24, 3.45, आदि) के रूप में या प्रतिशत में दर्ज़ा डेटा (12%, 55% आदि) को दिखाने के लिए डिज़ाइन किया गया है. उल्लेख स्वरूपों में से किसी में डेटा दिखाने के लिए पसंद जावास्क्रिप्ट भीतर कुछ ध्वज मान (moorating.js) बदलकर बस सेट कर सकते हैं
असल में वहाँ दो ई के साथ अपनी पसंद के स्वरूप में मान प्रदर्शित करने के लिए, खेलने दो झंडे कर रहे हैं ...

var inpercent = झूठी; / / सच यह ध्वज सेट है, अगर आप प्रतिशत मूल्यों को प्रदर्शित करने की आवश्यकता है
var isFractional झूठी = / / इसे सही पर सेट है, यदि आप 1.24, 1.25 के बजाय 4.56 1,2 तरह भिन्नात्मक मूल्यों ... 5 चाहते हैं

और मुझे लगता है कि वहाँ किसी भी स्पष्टीकरण के लिए यह आवश्यक है. इसके अलावा. स्क्रिप्ट बहुत सरल है. यदि आप एक छोटे से javascripting पता है, आप स्क्रिप्ट को संशोधित करने के लिए प्रदर्शित मान के किसी भी प्रकार मिल सकता है. उदाहरण के लिए अगर आप तीन दशमलव स्थानों को प्रदर्शित किया चाहता था ... बस स्क्रिप्ट के रूप में नीचे tweak के ...

अगर 3 / / 2 बदल जाता है; (isFractional) {moostartval मैं innerHTML = (एक्स, 3) formatNumber अगर (= 0 x <| x = 5>)}
और {moostartval [मैं] innerHTML = Math.round (x).

रेटिंग मूल्य अद्यतन:
मैं havent मूल्यांकन मूल्य को अद्यतन करने के लिए कोई AJAX स्क्रिप्ट लिखने, क्योंकि मैं अपने अनुभव से पता है कि यह नहीं हमेशा के लिए दर्ज़ा के रूप में उपयोगकर्ता दरों के रूप में कुछ जल्दी अद्यतन करना चाहते हैं परेशान. आप दर्ज़ा दिया गया है मूल्य के साथ करते हैं जो आप चाहते हैं के लिए मुक्त हैं, यह AJAX का उपयोग कर अद्यतन करें या यह जमा या एक छिपे हुए प्रपत्र फ़ील्ड मान सेट करने के लिए संपूर्ण प्रपत्र आदि के साथ प्रस्तुत किया जाना

समारोह updateRating (आईडी, दर्ज़ा) {
/ / चेतावनी (आईडी "," दर्ज़ा +);
/ / रेटिंग के साथ जो कुछ भी
}

जावास्क्रिप्ट में समारोह updateRating "कहा जाता है. इस समारोह रेटिंग डिव के आईडी पारित किया गया है, के रूप में पहचान रहा है जो (यदि वहाँ अधिक है कि पृष्ठ पर एक रेटिंग) अद्यतन किया गया था और रेटिंग के मूल्य [updateRating (आईडी, दर्ज़ा)] आप जो कुछ भी आप इन मूल्यों के साथ करना चाहते करने के लिए चुनते हैं, जैसा कि मैंने पहले उल्लेख किया है.

रेटिंग छवि: सितारे, दिल, बार्स, या कुछ भी आप कृपया
(तारे, आदि दिल) उपरोक्त प्रकार के किसी भी रेटिंग बदलना बहुत आसान है. सिर्फ एक प्रदान करने के लिए इसी तरह की छवि बना सकते हैं और अंदर ड्रॉप करने के लिए याद रखें, यदि आप छवि का नाम बदलने, सीएसएस फ़ाइल में आवश्यक परिवर्तन करने के लिए, नीचे देखें.

Moostar {मार्जिन: 0px; गद्दी: 0px; अतिप्रवाह: छुपा, चौड़ाई: 84px; ऊँचाई: 20px; फ्लोट: छोड़ा; पृष्ठभूमि: ('stars.gif') यूआरएल दोहराने - x;}.
. Moostar अवधि {फ्लोट: छोड़ा; मार्जिन: 0px; गद्दी: 0px; प्रदर्शन: ब्लॉक; चौड़ाई: 84px; ऊंचाई: 20px; पाठ सजावट: कोई नहीं; पाठ इंडेंट: 9000px, z-सूचकांक: 20;}
. Moostar curr {पृष्ठभूमि: यूआरएल ('stars.gif) 25px छोड़ दिया;}

अधिकांश मूल्यांकन विजेट प्रत्येक स्टार पर घटनाओं पर माउस के साथ स्टार और आधे स्टार छवियों का उपयोग करें. मू मूल्यांकन के लिए एक बहुत कम भूमि के ऊपर के साथ आवश्यक दृश्य प्रभाव को प्राप्त करने के लिए एक पृष्ठभूमि छवि के रूप में एक सरल प्रेत छवि का उपयोग करता है.

आवश्यकताएँ: 1.2 MooTools
डाउनलोड Mootols सितारा रेटिंग स्क्रिप्ट (718 बार डाउनलोड)


NDK घर | आईटी व्यक्त | व्यक्त तालु | व्यक्त Penmenship | श्रद्धा व्यक्त | अपने आप को व्यक्त