Изображения отказываются от центра - PullRequest
Новая
       48

Изображения отказываются от центра

1 голос
/ 26 марта 2012

Изображения отказываются от центра в HTML-код.Ширина авто и должна быть такой.Я пытаюсь центрировать изображения с помощью поля: автоцентрирование.Галерея должна быть шире, чем область просмотра.CSS и javascript: 

    #gallery{
        position:fixed;
        top:0px;
        left:50%;
        width:6000px;
        height:100%;
        margin-left:-3000px;
        background-image:url('images/bluey.jpg');
        background-position:center center;
        background-repeat:no-repeat;
        background-color:red;
    }
    .galimag{
        opacity:0.5;
        position:absolute;
        margin-left:auto;
        margin-right:auto;
        width:auto;
        height:80.3%;
        top:10.2%;
    }

</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    var T = setInterval(function(){
        $('img.galimag').css('width','auto');
        $('img.galimag').each(function(){
            var w = $(this).width();
            $(this).width(w);
        });
    },100);
</script>

Html Здесь: 

    <body>
      <div id="gallery">
          <img class="galimag" src="/images/grid.jpg"  alt="img"/> 
              <img class="galimag" src="/images/referrals.2.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.3.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.4.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.5.jpg"  alt="img"/>
      </div>
      <div id="controls"></div>
      <div id="ipad-controls"></div>  
  </body>

Как заставить их центрироваться?

Ответы [ 2 ]

1 голос
/ 26 марта 2012

Какого черта вы пытаетесь достичь с помощью функции интервалов?

Установите для #gallery значение text-align:center;

И абсолютное положение изображений.

0 голосов
/ 27 марта 2012

С помощью тега center , как показано ниже, или установки text-align: center; для родительского контейнера это будет сделано.

Я также настоятельно советую удалить ваш javascript, так как он на самом деленичего не делать и просто спамить консоль ошибками. 

  <body>
      <div id="gallery">

<center>

          <img class="galimag" src="/images/grid.jpg"  alt="img"/> 
              <img class="galimag" src="/images/referrals.2.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.3.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.4.jpg"  alt="img"/>
         <img class="galimag" src="/images/referrals.5.jpg"  alt="img"/>

<center>

      </div>


      <div id="controls"></div>
      <div id="ipad-controls"></div>  
  </body>
...