1. Приветствуем Вас на неофициальном форуме технической поддержки XenForo на русском языке. XenForo - коммерческий форумный движок от бывших создателей vBulletin, написанный на PHP.

Изменение расположения блока AjaxProgress

Тема в разделе "Вопросы по стилям, изменения в CSS и шаблонах", создана пользователем ivankuraev, 09.08.2011.

Загрузка
  1. ivankuraev

    ivankuraev Местный

    Регистрация:
    06.08.11
    Сообщения:
    45
    Симпатии:
    21
    всем привет
    отредактировал xenforo_overlay.css
    чтоб progress overlay отображался по центру страницы
    но он остается прикрепленным к верхней части окна

    вот код
    Код:
    #AjaxProgress
{
  position: absolute;
  left: 50%;
  margin: 0px auto 0px -50px;
  z-index: 1002;
  width: 100px;
  display: none;
}

#AjaxProgress.xenOverlay
{
  background-color: #000;
  opacity: 0.7;
  filter: alpha(opacity=70);
  height: 50px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -khtml-border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.35);
  -webkit-box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.35);
}

    #AjaxProgress.xenOverlay .content
    {
        @property "ajaxProgress";
        background: url('@imagePath/xenforo/widgets/upload.gif') no-repeat 50% 50%;
        height: 50px;
        position: absolute;
        width: 100%;
        z-index: 100;
        @property "/ajaxProgress";
    }
    что я делаю не так? :)
     
    ivankuraev, 09.08.2011
    #1
  2. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    У вас указана ширина блока и отступ с левого края. Но нет высоты и отступа от верхнего края.
    Возможно как-то так:
    Код:
    #AjaxProgress {
  position:absolute;
  left:50%;
  top:50%;
  margin:-40px auto 0 -50px;
  z-index:1002;
  width:100px;
  height:80px;
  display:none;
}
     
    Romchik®, 13.08.2011
    #2
  3. ivankuraev

    ivankuraev Местный

    Регистрация:
    06.08.11
    Сообщения:
    45
    Симпатии:
    21
    не помогает :(
     
    ivankuraev, 19.08.2011
    #3
  4. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    А где можно глянуть исходный код?
     
    Romchik®, 19.08.2011
    #4
  5. ivankuraev

    ivankuraev Местный

    Регистрация:
    06.08.11
    Сообщения:
    45
    Симпатии:
    21
    в инете не лежит еще
    собираюсь переходить с vbulletin на xenforo
    видоизменяю стандартный шаблон, путем добавления в extra.css
     
    ivankuraev, 19.08.2011
    #5
  6. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    А ведь лежал, первый пример я видел у вас вживую...
    Трудно сказать, не видя кода. Может !important нужно добавить везде.
     
    Romchik®, 19.08.2011
    #6
  7. CyberAP

    CyberAP Местный

    Регистрация:
    05.10.10
    Сообщения:
    2 604
    Симпатии:
    1 660
    Версия XF:
    1.5.10
    Этот код вам поможет:

    Код:
    #AjaxProgress
{
    top:50% !important;
    overflow: visible !important;
}
    #AjaxProgress .content
    {
        background-color: rgba(0,0,0,0.75) !important;
        position: relative;
        left: 50%;
        float: none !important;
        border-radius: 10px;
        width: 54px !important;
        height: 34px !important;
        box-shadow: 0 4px 16px rgba(0,0,0,0.5);
        overflow: visible !important;
    }
     
    CyberAP, 19.08.2011
    #7
    ivankuraev нравится это.

Поделиться этой страницей