Domanda

Ho un div vuoto chiamato #lightPole che ha un immagine di un lightpole sfondo. Sono in esecuzione di uno script per fare il lightpole estendere la lunghezza del contenitore. Tutto sembra buono nella maggior parte dei browser tranne IE 7. Per qualche ragione che non riesco a capire il lightpole sta espandendo modo passato il piè di pagina. Tutte le idee?

ecco il sito - http://greenlight.mybigcommerce.com/

ecco la javascript:

<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
$ (Document) .ready (function () { var Container_height = $ ( '# Container') Altezza ().; $ ( '# Lightpole') Altezza (Container_height).; });

Ecco alcuni dei css relativo alle div:

#Container {
height:auto;
width: 1100px;
margin: 0 auto;
background-image:url(../images/containerBackground_2.png)!important; /*this is a hack for IE6 to choose between background images*/
background-image:url(../images/containerBackgroundIE6.png);
background-position: center top;
overflow:hidden;
clear:both;
}


#Outer {
clear: both;
height: auto;
margin: 0 0 0 15px;
overflow: hidden;
padding: 0;
width: auto;

}

#Wrapper {    
clear: both;
float: left;
height: auto;
margin:9px 0 0 43px;
min-height: 350px;/***added to keep footer from hitting light on nav light pole**/
padding: 0;
width: 990px;

}


#LayoutColumn1{
 float: left;
height: 100%;
margin-bottom: 0;
margin-right: 0;
margin-top: 0;
position: relative;
z-index: 88;
clear:both;
}

#lightPole {
background:url(../images/lightPole8aSlice.png);
margin: 0 0 0 19.9px;
/*min-height: 320px;*/
overflow: hidden;
padding: 0;
position: absolute;
width: 15px;
z-index: -100;
 display: inline-block;
float: left;
}

Aggiornamento - Questo potrebbe essere causato da un div in modo improprio chiuso o un oggetto non di compensazione

?
È stato utile?

Soluzione

Ho riscontrato un problema precedente, che era simile ed è stato a causa di $ (document) .ready (function () sparare prima che tutte le immagini caricate. Provare a utilizzare $ (window) .load (function () {

Altri suggerimenti

È sembrano caricare 2 versioni di jQuery, allo stesso tempo: jquery 1.3.2 e 1.5.2. Anche se non ho appuntato il problema su quella appena ancora, è esaltante meglio rimuovere uno di questi.

Nella mia esperienza, ho avuto le immagini reagiscono in modo diverso con i seguenti pezzi di codice:

$('#myimage').height(200);

vs

$('#myimage').attr('height',200);

Il primo, quello che si sta utilizzando, aggiunge l'altezza l'attributo di stile, che, come si è scoperto, funziona bene nella maggior parte dei browser.

La seconda imposta l'attributo altezza stessa, e funziona in più browser. Non ho un'istanza IE7, ma si potrebbe provare questo.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top