Hallo zusammen ich habe da ein sehr sehr komisches Problem. Ich habe ein Weiterleitungsseite welches durch JavaScript Auflösung,Viewport und Pixeltiefe in ein Formular schreibt und dieses automatisch abgeschickt. Das ganze habe ich mit JQuery und ASP gelöst.

Folgendes Problem nun.

Auf der ganzen Seite werden 3 background-images folgendermassen geladen. (anbei eines davon)

Code :

1 2 3 4 5 6 7 8 9 10 11

#topLeft {     position: absolute;     left:0px;     top:0px;     background-repeat:repeat-x;     background-position: left top;     background-image: url(https://localhost/l30-bg_head_grey.png);     width:50px;     height:30px;     display:block; }

Am Ende meines aspx Dokumentes habe ich folgenden JQuery Teil welcher Daten ins Formular schreibt, ein paar divs erscheinen lässt und schlussendlich das Formular abschickt.

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13

$(function() {             $(document).ready(function() {                 $("#uData").append('<input type="hidden" id="resolution" name="resolution" id="resolution" value="' + screen.width + 'x' + screen.height + '"/>');                 $("#uData").append('<input type="hidden" id="viewport" name="viewport" id="viewport" value="' + $(window).width() + "x" + $(window).height() + '"/>');                 $("#uData").append('<input type="hidden" id="colordeep" name="colordeep" id="colordeep" value="' + screen.pixelDepth + '"/>');                 $("#redirText").attr("style", "");                 $("#ssubmit").attr("style", "display:none;");                 $("#footer").attr("style", "height:35px;");                 $("#uData").submit();             }             );         }         );

Nun kommt das interessante. Wenn ich diese Seite im IE oder Firefox lade, erscheinen alle Background-Images so wie sie sollen.
Wenn ich das ganze aber im Safari oder Chrome betrachten will, werden zwar alle CSS-Definitionen umgesetzt, bis eben auf diese background-images welche partout nicht erscheinen wollen.

Habe ich da irgendwas vergessen oder liegt das an der Rendering-Engine der beiden Browser die das nicht korrekt umsetzen wollen?

Eine interessante Feststellung noch zum Schluss. Kommentiere ich die unterste Zeile des JQuery teil raus, wird das ganze in allen Browsern korrekt umgesetzt, nur wird halt das Formular nicht mehr abgeschickt.

Ach ja, das Formular:

Code :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

<form action="Default.aspx" id="uData" method="post" runat="server">     <div id="topLeft"></div>       <div id="container">                        <div class="content">             <span class="mrQuestionText" style="">                 <noscript>                     <span class="mrErrorText">Um diese Seite korrekt auszuführen müssen Sie Java-Script aktivieren</span>                 </noscript>             </span>         </div>         <div class="display">         </div>         <div class="controls">             <div id="redirText" class="redirDiv" style="display: none;">                 <span class="redir">Sie werden weitergeleitet</span><br />                 <span class="redir">You will be redirected</span><br />                 <span class="redir">Vous allez être redirigé</span><br />                 <span class="redir">Verrai reindirizzato</span><br />             </div>                     </div>     </div>               <input type="hidden" name="sent" value="sent" />              <div id="footer">             <input id="ssubmit" type="submit" name="ssubmit" class="mrNext" style="" value="&gt;&gt;&gt;" alt="&gt;&gt;&gt;" />                 <p> </p>          </div>       </form>

Hatt irgend jemand von euch ne Idee wie ich das Problem in den Griff bekommen kann?

Grüsse

keiner eine Idee?

Also eine Sache vorweg, die nicht unbedingt mit deinem Problem zu tun haben muss:
Du hast das document.ready event doppelt. Sobald der erste ausgeführt wird, fügst du direkt einen zweiten Handler hinzu, der dann direkt ausgeführt wird.


Ich tippe mal das Problem liegt daran, wie die verschiedenen Engines damit umgehen (Safari und Chrome sind ja beide Webkit).

Du sendest das Formular sofort ab, sobald das Dokument vollständig ist (DOMReady). Das heißt aber nicht, dass auch alle Grafiken oder CSS Regeln geladen wurden. Wenn du dann das Formular absendest, wird Webkit das Rendern abbrechen, denn wozu weiter rendern, wenn sie Seite sowieso verlassen/neu geladen wird?

Wenn du unbedingt die Ladegrafik willst (was eigentlich sinnlos ist, denn du verlässt die Seite ja augenblicklich wieder), dann nimm $(window).load();

Hei Poly, du hast den Nagel auf den Kopf getrofen. Ich danke dir für die Hilfestellung.

Dani