एक साधारण jQuery स्लाइडर बनाने

Question

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

कोड यह रहा:

सीएसएस:

#wrapper { width: 500px; height:300px; display: block; overflow: hidden; } 
#slider {width: 1500px; clear: both; margin-left:0;} 
.content {float: left; width: 500px; height: 300px; display: block; background:grey;} 

HTML:

<div id="wrapper"> 
    <div id="slider"> 
     <div class="content"><p>blah</p></div> 
     <div class="content"><p>blah</p></div> 
     <div class="content"><p>blah</p></div> 
    </div> 
</div> 

<button id="left">left</button> 
<button id="right">right</button> 

और अंत में:

$#left.click(function { 
if ($('#slider').css('margin-left').between(0,-1500)) { 
    $('#slider').animate({ 
     margin-left : "+=500" 
    }, 500); 
}); 

} 
} 

जो 1500px चौड़ा युक्त div चलती करने के लिए अनुवाद आईएमए एक बटन क्लिक होने पर 500px से जीएस छोड़ दिया। स्लाइडर एक कंटेनर div के भीतर है जिसमें 500px चौड़ाई और छिपी हुई अतिप्रवाह है। अगर बयान के बाद यह कंटेनर div के अंत

मैं पूरी तरह किसी को भी आभारी हूँ जो इस बल्कि स्वार्थी अनुरोध के साथ मदद कर सकते हैं पर पहुँच गया है यकीन है कि div छोड़ दिया यात्रा जारी न रखे है

Answer 1

यहाँ अपने है जेएस कोड सिंटैक्स त्रुटियों के साथ जैसा कि ऊपर उल्लिखित है और साथ ही साथ कुछ अन्य त्रुटियां जो आपके कोड को सही तरीके से चलने से रोक रही हैं।

$('#left').click(function(){ 
    if ($('#slider').css('margin-left') <= '0px' && $('#slider').css('margin-left') >= '-1500px') {  
    $('#slider').animate({ 
      "margin-left" : "+=500" 
     }, 500); 
    }; 
}); 

नोट: मैं अपने कोड से .between() फ़ंक्शन को हटा दिया है के बाद से मैं इस कहीं पर किसी भी प्रलेखन नहीं मिल सका। यदि आपके पास इस फ़ंक्शन का संदर्भ है तो मुझे इसे देखना अच्छा लगेगा। अभी के लिए, मैंने इसे एक साधारण मूल्य तुलना के साथ बदल दिया है।

अपने कोड काम कर के साथ एक jsfiddle है:। http://jsfiddle.net/ghCX6/2/