Javascript div, выходящий за пределы контейнера в IE7 ~ помогите! - PullRequest
Новая
       33

Javascript div, выходящий за пределы контейнера в IE7 ~ помогите!

0 голосов
/ 26 июля 2011

У меня есть пустой div с именем #lightPole, который имеет фоновое изображение светового полюса. Я запускаю сценарий, чтобы осветитель продлил длину контейнера. В большинстве браузеров все выглядит хорошо, за исключением IE 7. По какой-то причине я не могу понять, что световой столб расширяется за нижний колонтитул. Есть идеи?

вот сайт - http://greenlight.mybigcommerce.com/

вот JavaScript: 

<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
$ (документ) .ready (function () { var Container_height = $ ('# Container'). height (); $ ( '# LightPole') высота (Container_height). });

Вот некоторые из CSS, связанные с 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;
}

Обновление - Может ли это быть вызвано неправильно закрытым div или плавающим не очищенным?

Ответы [ 3 ]

0 голосов
/ 26 июля 2011

Вы, кажется, загружаете 2 версии jquery одновременно: jquery 1.3.2 и 1.5.2.Хотя я еще не обвинил вашу проблему в этом, вероятно, лучше всего удалить один из них.

0 голосов
/ 26 июля 2011

По моему опыту, изображения по-разному реагировали на следующие части кода: 

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

против 

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

Первый, который вы используете,добавляет высоту к атрибуту стиля, который, как вы обнаружили, хорошо работает в браузерах MOST.

Второй устанавливает сам атрибут высоты и будет работать в других браузерах.У меня нет экземпляра IE7, но вы можете попробовать это.

0 голосов
/ 26 июля 2011

Я столкнулся с предыдущей проблемой, которая была похожа и была вызвана тем, что $ (document) .ready (function () срабатывает перед загрузкой всех изображений. Попробуйте использовать $ (window) .load (function () {

...