Перезапись неиспользованного div

0

Я работаю над гибким макетом сайта, где область содержимого для определенных страниц может иметь панель информации правой руки, а другие - нет. Я создаю этот сайт в рамках собственной CMS, которую использует моя работа. Теперь мы используем Шаблоны, где создается вся структура HTML, и используем макросы, чтобы вытащить содержимое, которое клиент вводит через CMS.

Обычно я бы создал отдельный шаблон для страниц, которые будут использовать правую панель и отдельный шаблон для тех, которые не являются, но поскольку клиент может захотеть добавить правые панели на страницы, которые их не имеют в будущем, Мне было интересно, есть ли какой-нибудь стиль перезаписи, который я могу добавить к моему шаблону, чтобы весь сайт мог работать на одном шаблоне, а не добавлять шаблон с правой панелью для одной страницы и шаблон, который не подходит для другого,

Мой код будет примерно таким:

CSS:

section#maincontent {width:720px; float:left;}
aside {width:240px; float:right;}

HTML:

<section id="maincontent">[conetent]</section>
<aside>[right_panel]</aside>

Есть ли часть javascript/CSS/веб-магии, которая может перезаписать правый div панели, если клиент решает добавить/удалить правую панель со страницы/шаблона, чтобы maincontent заполнил ширину страницы, не создавая новую шаблон с добавленным/удаленным стилем?

Теги:
templates

2 ответа

0

Вы можете просто изменить его, чтобы отобразить его.

HTML...

<div id="theOneToBeRemoved" onclick="remove()">
</div>

Javascript

function remove(){
   document.getElementById("theOneToBeRemoved").style.display = "none";
}

Замечу, что вы можете не захотеть добавить событие onclick в div... Может быть, добавьте кнопку X или закройте... что-то вдоль этих строк... Итак, если они нажимают на div, это случайно не закрывается... Кроме того, вы можете захотеть добавить некоторые css-переходы в свой div... Так что, когда он закрывает свою гладкую, а не крутую.. Выглядит намного лучше

0

Добавьте обертку div, выведите класс "withoutRightPanel", если вы хотите "удалить" правую панель и добавить правила css ниже:

HTML

<div class="withoutRightPanel">
    <section id="maincontent">[conetent]</section>
    <aside class="rightPanel">[right_panel]</aside>
</div>

CSS

.withoutRightPannel .rightPanel
{
   display:none;
}
.withoutRightPannel #maincontent
{
    //Fill the gap after you hide right panel, or you can set a value by pixel
    width:100%;
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню