केंद्रिंग bxslider jquery प्लगइन

मुझे अपने एचटीएमएल पेज के भीतर bxslider प्लगइन को केंद्रित करने में कठिनाइयों का सामना करना पड़ रहा है।केंद्रिंग bxslider jquery प्लगइन

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 

    <title>Everry - Customise Now Proto</title> 
    <link rel="stylesheet" href="css/styles.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
    <script src = "js/jquery.bxSlider.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
      $('#slider1').bxSlider(); 
      }); 
    </script> 

</head> 
<body> 
<h1>Customise Now Prototype</h1> 
<div align = "center" id="slider1"> 
    <div>Slide one content</div> 
    <div>Slide two content</div> 
    <div>Slide three content</div> 
    <div>And so on...</div> 

</div> 
</body> 
</html>

और मेरे सीएसएस:

body{ 
    background-color: #fff; 
    margin: 0; 
    padding: 0; 
    text-align: center; 
} 

#slider1 { 
    width: 700px; 
    height: 350px; 
    margin: 0 auto; 
    liststyle: none; 
}

हालांकि यह केंद्र बंद हो गया लगता है

यहाँ मेरी HTML है।

http://everry.com/new/customise/customisenow.html

मुझे यकीन है कि क्यों नहीं कर रहा हूँ: यहाँ यूआरएल है?

स्रोत

2011-10-20 user559142

#bx-wrapper {margin:0 auto; width:700px;}

स्लाइडर प्लगइन बदल देती है कि आप HTML, इसलिए केंद्रित :)

स्रोत

2011-10-20 18:07:36

यह अब और काम नहीं कर रहा है। चौड़ाई शैलियों को ऑनलाइन स्टाइल के रूप में जोड़ा जाता है। यह मुझे पागल कर रहा है। मैं 'महत्वपूर्ण 'का उपयोग नहीं करना चाहता हूं। क्या कोई और तरीका है? – rgin

क्या आप डेमो को एक लिंक दे सकते हैं ... आपको अभी भी इसके बाहर एक कंटेनर बनाने में सक्षम होना चाहिए :) –

नोट: सीएसएस को हमेशा बाहरी सीएसएस स्टाइलशीट में लागू किया जाना चाहिए, न कि आपके दस्तावेज़ के बॉडी, जैसा कि bxslider में सूचित किया गया है [site] (http://bxslider.com/examples/thumbnail-pager-2) – stom

तुम बेवकूफ गणना मार्जिन और चौड़ाई ओवरराइड करने के लिए है के लिए स्लाइडर कंटेनर का उपयोग नहीं है। यह प्लगइन बहुत अच्छा है लेकिन वे अपने कार्यान्वयन और दस्तावेज़ीकरण के साथ मैला हैं। बस नीचे अपनी छवि चौड़ाई प्लग करें जहां मेरे पास 940 है और इसे "ऑफ-सेंटर" समस्या के साथ आपकी समस्या को ठीक करना चाहिए।

.bx-wrapper, .bx-window { 
    margin:0 auto; width:940px !important; 
} 

.pager{ 
    width:940px !important; 
} 

#slider1 li{ 
    margin-left:0px !important; 
}

स्रोत

2011-12-07 02:23:28

केंद्रिंग bxslider jquery प्लगइन

उत्तर

संबंधित मुद्दे