Блог

Пожалуйста, помогите мне исправить двух персонажей мультфильма в нижней части содержимого

CSS ТЕПЕРЬ РАБОТАЕТ: — Исправлена позиция внизу, как и предлагалось: http://plungjan.name/test4.html

jQuery: http://plungjan.name/test2.html

Кажется, я неправильно вычисляю, где они должны быть.

В качестве альтернативы было бы здорово предложить чистый CSS, поскольку в этом случае я использую jQuery только для этого единственного позиционирования.

Пожалуйста, обратите внимание, что их ДВА, поэтому я не думаю, что смогу использовать footer glue или footerpush или как там это называется.

   $(document).ready(function(){

     var footerHeight = 0,
         docHeight,
         footerTop = 0,
         $footer = $(".child");

     positionFooter();

     function positionFooter() {

       footerHeight = $footer.height();
       footerTop = ($("#contentcontainer").height()-footerHeight-45) "px";
/*
      docHeight=$(document).height();
       if (footerTop > (docHeight-footerHeight)) {
         alert("using " docHeight  " instead of " footerTop)
         footerTop = (docHeight-footerHeight) "px";
       } */

       $footer.animate({top: footerTop})
     }
     // $(window).scroll(positionFooter).resize(positionFooter)
  });
  

Почему бы вам просто не использовать

 #boy1, #girl1 {
    bottom: 0
}
  

вместо этого?

Обновление, более конкретно: сначала перейдите к вашему global_styles.css файлу. Тот, который используется в http://plungjan.name/test2.html . Заменить

 #girl1 {
    position: absolute;
    left: -95px;
    top: 170px;
    z-index: 1;
}
  

с помощью

 #girl1 {
    position: absolute;
    left: -95px;
    bottom: 0;
    z-index: 1;
}
  

и

 #boy1 {
    position: absolute;
    left: 885px;
    top: 175px;
    z-index: 1;
}
  

с помощью

 #boy1 {
    position: absolute;
    left: 885px;
    bottom: 0;
    z-index: 1;
}
  

Не применять position: fixed .

 #boy1, #girl1 {bottom:0px;}
  

сделал бы это.

Кстати. вы должны поместить #girl1 за пределами #hp_col_1 div, точно так же, как #boy1 .