• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Weisser Balken im IE

Morpheus

Neues Mitglied
Hi Comm

Ich habe ein Popupfenster zu einem Plugin von Photobucket.com gebastelt. Funktioniert wunderbar mit Firefox ... aber leider nicht mit dem IE wo ein weisser Balken (oben) das Problem ist.

Code:
    <html>
    <head>
    </head>
    <body bgcolor="#000000">
    <iframe name="plugin" src="http://photobucket.com/plugin?width=600&height=350&largeThumb=&pbaffsite=mysite.com&bg=%23000000&border=false&bordercolor=%23000000&url=&linkType=img&textcolor=%23FFFFFF&linkcolor=%23FFBF00&media=image&btntxt=&searchenabled=false&searchlinkcolor=&searchbgcolor=" bgcolor="transparent" width="600" height="350" frameborder="0" scrolling="no"></iframe>
    </body>
    </html>
Screenshot vom IE: http://i625.photobucket.com/albums/tt335/themorpheus2000/whitetop.jpg

lg morph
 
Zuletzt bearbeitet:
Das schaut so aus, als hättest du eine Leerzeile mit weißem Hintergrund drin. Aber wo das her kommt, weiß ich nicht. :???:
 
Das schaut so aus, als hättest du eine Leerzeile mit weißem Hintergrund drin. Aber wo das her kommt, weiß ich nicht. :???:

Genau :sad:

Der Firefox sieht das allerdings richtig, da gibts keine Leerzeile, und schon gar nicht weiß ...

Wieso ist der IE eigentlich so ein Mist? Sehe soetwas nicht das erste mal ...
 
Hallo Morpheus!

Du könntest ja um den iFrame mal einen grauen Rahmen legen, dann siehst du, wo die Leerzeile enthalten ist. Und anschließend eben mit CSS die font-size auf 0 setzen.
Ein anstendiger Doctype könnte auch Interpretationsdifferenzen vermeiden.

Gruß,
fiedel
 
Sorry, ich konnte auch leider nichts im Quellcode des iframe sehen. :(
Der IE hat schon seit der ersten Version seine eigenen Standards kreiert. Langsam, sehr langsam passt er sich an die "eigentlichen" Standards an.
 
Ah! Ich glaube ich habs: Ganz am Anfang der Datei steht <html>. Danach kommt der (unvollständige) Doctype. Hau das aller erste <html> raus. :)
 
...dann siehst du, wo die Leerzeile enthalten ist.
Naja, ich habe ja einen schwarzen Hintergrund für meine HTML Datei, also denke ich das es am iframe liegt...

Hau das aller erste <html> raus. :)
Hab alles probiert ... ohne html tags, ohne head ohne body ... auch ohne allem abgesehen vom iframe.

Aber selbst ohne allem (nur iframe) ist der balken da, auch wenn man ihn nicht sieht da ja der hintergrund dann auch weiss ist, aber es fehlt nach dem einloggen bei photobucket.com an der unterseite eine zeile, das verrät mir das der weisse balken oben immer noch da ist ...

lg morph

P.S. was ist ein Doctype ?
 
HTML:
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="index,follow">

    <meta name="description" content="Photobucket offers image hosting, free photo sharing and video sharing. Upload your photos, host your videos, and share them with friends and family."/>
    <meta name="keywords" content="free image hosting, free video hosting, image hosting, video hosting, photo image hosting site, video hosting site"/>


<title>Image hosting, free photo sharing &amp; video sharing at Photobucket</title>

<link href="http://static.photobucket.com/modules/opensearch/OpenSearch.xml" rel="search" type="application/opensearchdescription+xml" title="Photobucket Image Search">
<!-- Start CSS -->
<link href="http://static.photobucket.com/include/css/pkgs/mediaplugin_v20.6.6.css" rel="stylesheet" type="text/css">

<style media="print" type="text/css">
body:before {
    content: url("/printtrack");
}
</style>

<script src="http://static.photobucket.com/include/js/pkgs/mediaplugin_v20.6.6.js" type="text/javascript"></script>
    <style type="text/css">
/* ************************ UNIVERSAL *********************** */
#entireWidget {
     
        border: none;
        background-color: #000000;
    width: 600px;
    height: 350px;
}
#entireWidget .textcolor {
    color: #FFFFFF !important;
}
#entireWidget .linkcolor {
    font-weight: normal;
    color: #FFBF00 !important;
}
#entireWidget a:link, a:visited, a:hover, a:active {
    font-weight: normal;
    color: #FFBF00;
}
#groupSearchModeLinksJWidgetSearch, #containerJWidgetSearch .groupSearchInputs {
    width: % !important;
}
.searchLink {
    color: #FFFFFF;
}
.xpanel4Outer, .xpanel4Inner, .xpanel4Lower, .xpanel4LowerInner {
    background-color: #000000;
}

#signIn {
        margin-top: 2em;
        width: 476px;
}
#myspaceIntroDiv, #myspaceSearchDiv {
    padding-left: 0px;
}
#containerJWidgetSearch {
    width: 600px;
    //padding:0;       
}

#containerJWidgetSearch {
    height: px;
    padding-top: px;
    padding-bottom: px;
    //padding: 0;
}

/* ************************ ALBUM ONLY *********************** */

/* ************************ ALBUM OR SEARCH ONLY *********************** */

/* ************************ CUSTOMIZED SEARCH ONLY *********************** */

/* *************************** SEARCH ONLY *********************** */
</style>

<!-- mediaPlugin::index::plugin -->
</head>
<body class="is_moz is_win is_win_moz" >



<!-- Lightbox -->
<div id="overlay" class="overlay">
</div>
<div id="lightbox" class="lightbox">
                    <div class="container">
    <div id="lightboxcontent" class="content">
    </div>
</div>    </div>

                

<div id="lightboxMessagePanel" class="messagePanel " style="display: none;">
    <a id="lightboxMessagePanelHash" name="lightboxMessagePanelHash"></a>
    <div class="icon message_icon"></div>
    <a title="close" href="javascript:void(0);" class="icon close" onclick="document.fire(PBMessage.EVENT.CLOSE,{id:'lightboxMessagePanel'});"></a>
    <div class="content">
        <h1 class="message"></h1>
        <div class="details"></div>
        <div class="clearSafely"></div>
    </div>
</div>


<!-- used to measure string width in javascript code (in global.js) ... couldn't set -->
<!-- display: none; as this resulted in 0 width strings on at least FF and safari -->
<div id="stringWidthMeasure" style="height: 0px !important;"></div>


        <div id="entireWidget">
<!--            <table style="height:100%;width:100%;border-collapse:collapse;text-align:left"><tr><td style="text-align:left;height:400px;vertical-align:middle">-->
                

<!-- Begin Sign In Block -->
<form name="loginform" action="/plugin/submitlogin" method="post">

    <div id="signIn"  class="xpanel4Outer">
        <div class="xpanel4Inner">
            <input type="hidden" name="action" value="login">
            <div id="grpHeader">
                <a href="http://photobucket.com?referer=jwidget" target="_blank"><img id="imgLogo" src="http://pic.photobucket.com/jwidget/logo.jpg" alt="Photobucket"></a>
                <br class="clearL">
                                    <span id="alreadyMember">Image and Video Hosting</span>
                            </div>
            <br class="clearL">
            <label for="username" class="floatL">username:</label>
            <input type="text" name="username" id="username" class="floatL" value="" onFocus="highlight(this);" size="38" maxlength="50">
            <br class="clearL">

            <label for="password" class="floatL">password:</label>
            <input type="password" name="password" id="password" class="floatL" value="" onFocus="highlight(this);" size="38" maxlength="50">
            <br class="clearL">
            <div id="containerRemember"><input type="checkbox" name="remember" id="remember" >
                <label for="remember" id="lblRemember">Remember Me!</label>
            </div>
            <br class="clearL">
            <div id="loginButton">
                <button type="submit" class="button_blue tight" name="login" id="inptSubmit" onClick="document.forms.loginform.submit();return false;">Login</button>
            </div>
        </div>

        <div class="xpanel4Lower">
            <div class="xpanel4LowerInner">
                Not a member?<a href="/plugin/register" id="buttonJoinNow" class="button_upsell_green tight">Join Now!</a>
                <br>
                <a target="_blank" href="http://photobucket.com/userinfo?plugin=true" class="getUP">Forgot username or password?</a>
            </div>
        </div>
    </div>
</form>

    
<!--            </td></tr></table>-->
            <div style="display:none">
                <!-- This iframe is used for the advanced callback javascript - do not remove -->
                <iframe src="" height="0" width="0" id="ifr"></iframe>
            </div>
        </div>
        <script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>
        <script type="text/javascript">
            var pageTracker = _gat._getTracker("UA-245455-2");
            pageTracker._trackPageview();
        </script>
       </body>
    </html>
Probiere es mal so!
 
Naja, ich habe ja einen schwarzen Hintergrund für meine HTML Datei, also denke ich das es am iframe liegt...
Im iFrame ist auch ein (zu mindest teilweise) schwarzer Hintergrund.

Hab alles probiert ... ohne html tags, ohne head ohne body ... auch ohne allem abgesehen vom iframe.
Rapid10 hat nicht von dem Popup-Fenster geredet, sondern von der Seite, die du per Frame einbindest (photobucket.com). Aber ich bezweifle, dass du da etwas im Code ändern kannst... Mit welcher Version des IE hast du es denn getestet?

P.S. was ist ein Doctype ?
Autsch! :-P
Der Doctype eines HTML-Dokuments gibt an, nach welchen HTML-Regeln des W3C du codest. Je strikter die Regeln, umso weniger Differenzen zwischen den einzelnen Browsern.

EDIT: Ist mir grad so aufgefallen: Warum bindest du die Seite eigtl. überhaupt über ein iFrame ein? Rufe sie doch direkt im Popup-Fenster auf!
 
@Rapid - Vielen Dank, aber es hat leider nix geholfen :(

Mit welcher Version des IE hast du es denn getestet?
IE 8

EDIT: Ist mir grad so aufgefallen: Warum bindest du die Seite eigtl. überhaupt über ein iFrame ein? Rufe sie doch direkt im Popup-Fenster auf!
Gute Idee - habs gemacht, und - der weisser Balken ist immer noch da ;ugl

Ich glaube ich geb auf, an der Pluginseite von photobucket kann man ja doch nichts ändern ...

lg morph
 
Zurück
Oben