Frage

Ich habe ein Stück Code, der auf Fenster Resize läuft. Ich ziehe die width und outerWidth ein Eingabetextelement.

Dieser Prozess funktioniert in jedem Browser gut, außer Webkit, die das richtige Ergebnis liefert von outerWidth , aber das Ergebnis von width ändert sich nie von dem auf Last Original.

Dies ist tatsächlich Konsolenausgabe von meinem Skript, wenn das Browserfenster Ändern der Größe (Dies ist Chrome, aber das gleiche geschieht in Safari 4):

outerWidth: 772
width: 772
outerWidth: 773
width: 772
outerWidth: 773
width: 772
outerWidth: 794
width: 772
outerWidth: 794
width: 772
outerWidth: 815
width: 772
outerWidth: 815
width: 772
outerWidth: 820
width: 772
outerWidth: 837
width: 772

Hat jemand diese Erfahrung gemacht, bevor? Wissen Sie, warum es passiert? Und was am wichtigsten ist, wissen Sie, wie um ihn zu arbeiten? :)

Danke.

War es hilfreich?

Lösung

Hier ist mein Testfall. Beide scheinen wie erwartet zu funktionieren (Safari 4).

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <style type="text/css">
    input {
      width: 50%;
      height: 2em;
      font-size: 1em;
    }
  </style>
</head>
<body>
  <p>
    <input type="text" id="w" />
  </p>
  <p>
    <input type="text" id="ow" />
  </p>
  <script type="text/javascript">
    function init(){
      $('#w').val($('#w').width());
      $('#ow').val($('#ow').outerWidth());
    }
    $(function(){
      init();

      $(window).resize(function(){
        init();
      });
    });
  </script>
</body>
</html>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top