Брендинг sharepoint: размер ширины страницы благодаря функции _spBodyOnLoadWrapper()

Я пытаюсь придумать другой внешний вид на своем сайте sharepoint. Я пытаюсь уменьшить ширину основного содержимого до 960 пикселей под тегом формы в конструкторе sharepoitn. когда я обновляю страницу в первый раз, она отображает основное содержимое до 960 пикселей, но когда загрузка страницы завершается, основное содержимое растягивается на всю ширину экрана.

Я узнал, что это из-за скрипта onload, запущенного в теге body. но я не могу удалить этот скрипт, потому что эта работа имеет побочные эффекты на функциональность страницы.

функция _spBodyOnLoadWrapper().

кто-нибудь знает эту функцию? или кто-нибудь знает, как решить эту проблему?

ОБНОВЛЕНИЕ № 1:

Мой код CSS выглядит следующим образом. Я добавил этот класс в основную форму на главной странице:

.mainContent
{
width: 960px;
height:100% !important;
min-height:100% !important;
padding-top: 10px;
margin-left: auto;
margin-right: auto;
direction:rtl;
}

ОБНОВЛЕНИЕ № 2:

Я использую шаблон v4.master. Я вынул ленту из тега формы. это сразу после тега body. потому что я хотел, чтобы лента была натянута сверху. но когда я добавлю эту строку кода

<body onload="if (typeof(_spBodyOnLoadWrapper) != 'undefined') _spBodyOnLoadWrapper();">

основное содержание взрывается. что-то в заголовке растягивается по всей ширине, а некоторые панели внизу остаются 960px.

1 ответ

Вы заинтересовали меня, поэтому я воссоздал вашу проблему. По умолчанию javascript будет пытаться встроить ширину на основе своих расчетов. Тем не менее, вам нужно установить класс s4-notsetwidth для контейнера-обертки.
Вот что я сделал, чтобы исправить вашу проблему
Добавьте это к голове

<style type="text/css">
#s4-bodyContainer {
    width: 960px;
    height:100% !important;
    min-height:100% !important;
    padding-top: 10px;
    margin-left: auto;
    margin-right: auto;
}
/* Aligns the Top Bars */
.ms-cui-ribbonTopBars {
width: 960px!important;
margin-left:auto;
margin-right:auto;
}

/* Turns off the border on the bottom of the tabs */
.ms-cui-ribbonTopBars > div {
border-bottom:1px solid transparent !important;
}
</style>

Затем найдите рабочую область s4 (которая является непосредственным родителем #s4-bodyContainer и добавьте класс s4-nosetwidth. Это должно сработать для вас. Используйте эти две ссылки для достижения именно того, что вы хотите (не уверен, хотите ли вы выровнять ленту или нет) Пост Рэнди Дрисгилла и пост Тома Уилсона.

Другие вопросы по тегам