Брендинг 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. Это должно сработать для вас. Используйте эти две ссылки для достижения именно того, что вы хотите (не уверен, хотите ли вы выровнять ленту или нет) Пост Рэнди Дрисгилла и пост Тома Уилсона.