Кнопки. Скрытые блоки

@CatInTheBread · Регистрация: 23.01.2013

Author24 — интернет-сервис помощи студентам

Всем Привет! Возможно название темы не будет совпадать с содержимым моего вопроса)...Ну да ладно...
Есть страничка с кнопками...http://osobniak.com/дизайн-интерьеров
Кнопки стоят вертикально и контент открывается соответственно блоком под каждой кнопкой. Хотелось бы сделать все по симпатичнее. Например кнопки горизонтально, и при нажатии открывался блок с контентом на всю ширину страницы или кнопки вертикально с лева, а контент открывался с права...

Или может кто знает как это сделать вообще не прибегая к использованию кнопок?!?

Если есть идеи буду признателен! Вот код кнопок.

Javascript

<!-- Lightbox Plus ColorBox v2.6/1.3.32 - 2013.01.24 - Message: 0-->
function onclick(event) {
console.log("text1");
var txt = event.target.innerText;
if (txt == "Современные интерьеры")
{
jQuery("#ToggleRestavration").slideToggle("slow");
}
else if (txt == "Классические интерьеры")
{
jQuery("#ToggleBaton").slideToggle("slow");
}
else if (txt == "Интерьеры для офиса")
{
jQuery("#ToggleElseBaton").slideToggle("slow");
}
else if (txt == "Интерьеры для ресторана")
{
jQuery("#TogglePestapan").slideToggle("slow");
}
};
jQuery(document).ready(function($){
$("a[rel*=lightbox]").colorbox({speed:0,width:false,height:false,innerWidth:false,innerHeight:false,initialWidth:false,initialHeight:false,maxWidth:false,maxHeight:false,scalePhotos:false,opacity:0,preloading:false,current:" {current} {total}",previous:"",next:"",close:"",overlayClose:false,loop:false,scrolling:false,escKey:false,arrowKey:false,top:false,right:false,bottom:false,left:false});
$("button").each(function(item) {
$(this).click(onclick);
});
});

CSS

.but_lavender {
margin: 10px 0px 0px 0px;
text-decoration: none !important;
color: #333;
font: 100% Arial, Helvetica, sans-serif;
padding: 5px 13px;
font-size: 13px;
border: solid 1px #aaa;
border-color: #99958c;
background: #c0c0c0;
background: -moz-linear-gradient(top, #f7f0fe 0%, #e8d1ff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f0fe), color-stop(100%,#e8d1ff));
background: -webkit-linear-gradient(top, #f7f0fe 0%,#e8d1ff 100%);
background: -o-linear-gradient(top, #f7f0fe 0%,#e8d1ff 100%);
background: -ms-linear-gradient(top, #f7f0fe 0%,#e8d1ff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f0fe', endColorstr='#e8d1ff',GradientType=0 );
background: linear-gradient(top, #f7f0fe 0%,#e8d1ff 100%);
vertical-align: middle;
display: inline-block;
zoom:1;
*display:inline;
text-shadow: 0 1px 0 rgba(255,255,255,.5);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.1), inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.3);
-moz-box-shadow: 0 1px 0 rgba(0,0,0,.1), inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.3);
box-shadow: 0 1px 0 rgba(0,0,0,.1), inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(255,255,255,.3);
}
.but_lavender:hover {
text-decoration: none;
background: #d0f0c0;
}
.but_lavender:active {
position: relative;
top: 1px;
}

@kalabuni · 06.06.2013, 14:29

у вас вопрос по HTML-вёрстке и по JQuery - зачем сюда-то обращаться?
посмотрите на главной странице ссылки на соответствующие подфорумы

@CatInTheBread · 06.06.2013, 14:40 **[ТС]**

Это же разные разделы...Не буду же я и там и там размещать тему...

@kalabuni · 07.06.2013, 02:57

Сообщение от CatInTheBread

Это же разные разделы...Не буду же я и там и там размещать тему...

смешно

два разных нужных вам раздела, но вы поместили в третий - в вам не нужный

@CatInTheBread · 07.06.2013, 11:15 **[ТС]**

Ну когда я помещал я не знал, что этот раздел совсем не подходит)...

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,625
	06.06.2013, 14:29	2
	у вас вопрос по HTML-вёрстке и по JQuery - зачем сюда-то обращаться? посмотрите на главной странице ссылки на соответствующие подфорумы 0

@CatInTheBread 1 / 1 / 0 Регистрация: 23.01.2013 Сообщений: 23
	06.06.2013, 14:40 [ТС]	3
	Это же разные разделы...Не буду же я и там и там размещать тему... 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,625
	07.06.2013, 02:57	4
	Сообщение от CatInTheBread Это же разные разделы...Не буду же я и там и там размещать тему... смешно два разных нужных вам раздела, но вы поместили в третий - в вам не нужный 0

@CatInTheBread 1 / 1 / 0 Регистрация: 23.01.2013 Сообщений: 23
	07.06.2013, 11:15 [ТС]	5
	Ну когда я помещал я не знал, что этот раздел совсем не подходит)... 0