IE8 - button, hintergrund Bild nicht angezeigt wird?

Habe ich einen submit-button der folgenden CSS:

  .button{
    border:1px solid #015691;
    background-image:url('http://boundsblazer.com/pkg/pics/
         buttons/small-button.png');
    color:#ffffff;
    height:18px;
    font-size:8pt;
    font-family:sans-serif, verdana;
    cursor:pointer;
    line-height:14px;
    margin-bottom:-5px;
    border-bottom-color:#222222;

    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    behavior: url("http://boundsblazer.com/pkg/plugins/PIE.htc");
  }

und meine JQuery...

$(".button").mousedown(function(){
    $(this).css('border-bottom-width', '0px');
    $(this).css('background-image', 'url(\'http://boundsblazer.com/pkg/pics/buttons/small-button-pressed.png\')');

    $(this).mouseout(function(){
          $(this).css('border-bottom-width', '1px');
          $(this).css('background-image', 'url(\'http://boundsblazer.com/pkg/pics/buttons/small-button.png\')');
    });
    $(this).mouseup(function(){
          $(this).css('border-bottom-width', '1px');
          $(this).css('background-image', 'url(\'http://boundsblazer.com/pkg/pics/buttons/small-button.png\')');
    });
});

Merkwürdig, dieser hat keine Probleme im IE7 oder IE9, nur IE8. Was passiert, ist, dass das Bild für die Schaltflächen nicht angezeigt. Es funktioniert auf Safari, Chrome, Firefox, Opera, IE7 und IE9, nur eben nicht IE8. Wenn Sie möchten, um es zu sehen, seine http://boundsblazer.com. Bitte um Hilfe!!

On a side note, die "grenzüberschreitende Lösung" nicht funktioniert, wie Sie sehen können, als ich erklärte, dass die Grenze in der CSS.

Problem gelöst:

Den behavior - tag funktioniert nicht im IE8, wenn Sie so wollen, PIE-CSS3 für abgerundete Rahmen im IE8, es ist ein no-go. Auch das hinzufügen:

background:transparent url()

und loszuwerden:

background-image:url()

gearbeitet.

  • Das argument url() erfordert keine einfachen Anführungszeichen. Haben Sie versucht, die $(this).css("background-image", "url(http://boundsblazer.com/pkg/pics/buttons/small-button-pressed.png)");?
  • tun, nur ein Sek
  • Das hat nichts ändern... 🙁
  • Könnte es sein, dass das Verhalten in .Taste ändert sich der hintergrund etwas IE8 nicht verstehen?
  • Vielleicht, schlecht geschnitten, dass für eine Sekunde.
  • Ja, das war das Problem! Aber wie sonst will ich umsetzen, gerundeten Grenzen? D:
  • Auch, Sie können machen, dass eine Antwort, und ich werde es akzeptieren. :3
  • In meinem Fall, nur das entfernen der behavior Eigenschaft aus der CSS das problem gelöst.

InformationsquelleAutor | 2012-01-16
Schreibe einen Kommentar