Bootstrap-jquery-ui-slider

Versucht haben, Sie zum anpassen der jquery slider Breite, um die richtige Größe und seine Grenze ziehen, die außerhalb der Fläche.
Ich habe verstanden, dass der font-size macht der slider richtig skaliert ; aber die Einstellung schriftart,-Größe bewirkt, dass die Breite, um das Aussehen wierd.
Wie kann ich senken Sie den Schieberegler, Boxen, kleinen Plätzen und nicht Herausrutschen ?

jsfiddle /edit hier http://jsfiddle.net/EkkKG/

    <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
       <div class="container">
        <a data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </a>
    <a href="#" class="brand">Project name</a>
    <div class="nav-collapse">
      <ul class="nav">
         <li class="dropdown">
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">Dropdown <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li><a href="#">
                <p>
                                <label for="amount">Price range:</label>
                                <input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
                            </p>

                <!--div style="font-size:10px;"-->
                   <div id="slider-range"></div>
              <!--/div-->
                </a></li>

            <li><a href="#">Another action</a></li>

          </ul>
        </li>
      </ul>
    </div><!-- /.nav-collapse -->
  </div>
</div><!-- /navbar-inner -->
  </div>

jquery

    $( "#slider-range" ).slider({
            range: true,
            min: 0,
            max: 500,
            values: [ 75, 300 ],
            slide: function( event, ui ) {  $( "#amount" ).val( "$" + ui.values[ 0 ] + " -   $" + ui.values[ 1 ] );
            }
  });
   $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) + " - $" + $(  "#slider-range" ).slider( "values", 1 ) );

Bootstrap-jquery-ui-slider

Diese Geige in "Inkognito" - Modus in chrome gab mir mein gewünschtes Ergebnis
aber auf meine eigentliche Seite noch nicht

Ihre Geige sieht gut zu mir. Etwas anderes darf stören.
ja, ich spielte herum und deutete auf version 2.2 css von bootstrap und es funktionierte.

InformationsquelleAutor sunny | 2012-10-30

Schreibe einen Kommentar