VPF::менять позиционирование от ширины экрана

supervladislav

Дата 15.9.2011, 12:31 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

Мне надо написать скрипт меняющий позиционирование главного слоя я сделал что-то вроде вот этого
коофециент взятый при максимальном позиционировании слоя делённый на ширину <скажите народ может кто-то делал чего по серьёзднее как более точно просчитать на сколько нужно сдвигать главный слой код Javascript

Код




        <script language="javascript">
function razmerokna(){
int x=Math.round(window.screen.width/9);
   document.getElementById("main").style.position=+x;
 
}
</script>

InfMag

Дата 15.9.2011, 12:53 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

supervladislav, Ну зачем?)) Когда это просто можно сделать CSS:

Код


#main {
  margin: 0 auto;
}

Добавлено через 57 секунд
Или это я что-то перепутал? В чём состоит задача?

supervladislav

Дата 15.9.2011, 14:18 (ссылка)

(нет голосов)

Загрузка ...

///\\\///\\\///\\\

Профиль
Группа: Завсегдатай
Сообщений: 1771
Регистрация: 18.5.2006

Репутация: нет
Всего: -9

Фиксированный слой по ширине отпозиционирован по relative внутри этого слоя есть
слои по absolute ,нужно чтобы центральный слой всегда был по середине

Добавлено через 6 минут и 6 секунд
твой вариант абсолютно позиционированные слои не сдвигает

InfMag

Дата 15.9.2011, 14:27 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

supervladislav, ну тогда я всё верно написал, css:

Код


html, body {
  width: 100%;
  height: 100%;
}

#main {
  margin: 0 auto;
  width: 500px; /*можно и 80%*/
  background: red;
}

Добавлено через 5 минут и 52 секунды
Проверил, всё отвечает требованиям:

Код


<html>
<head>
    <style type="text/css">
    html, body {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }
    
    body {
        background: silver;
    }
    
    #main {
        position: relative;
        width: 50%;
        height: 100%;
        background: green;
        margin: 0 auto;
    }
    
    #abs1 {
        position: absolute;
        left: 100px;
        top: 0;
        color: blue;
    }
    
    #abs2 {
        position: absolute;
        right: 50px;
        top: 50px;
        color: brown;
    }
    </style>
</head>
<body>
    <div id="main">
        <div id="abs1">321</div>
        <div id="abs2">qqq</div>
        blablabla
    </div>
</body>
</html>

Добавлено через 8 минут и 14 секунд
supervladislav, вероятно у Вас родительский блок не relative.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »