Трява ми подобно меню

L

lays

Registered
Добър вечер. Интересува ме как мога да си направя следното меню. Може да не е точно същото, ами някакво с java script или няма значение... ако някой може да помогне с код, ще е златен :wink:
 
Ето ти css

body {
margin: 0px 0px;
padding:0px;
text-align:center;
background-image: url('../images/interface_15.jpg');
background-repeat: repeat-x;
}
img { border: 0px; }
fieldset {
border: 0px solid #717171;
}
#error {
background: #FFE064;
color: #CC0000;
border: 1px solid #FF9264;
padding: 5px;
text-align: center;
font: 15px tahoma;
}
label {
width: 110px;
display: block;
float: left;
height: 28px;
}
.inp {
border: 0px;
background: url('../images/contacts_01.jpg') no-repeat;
width: 415px;
height: 28px;
padding: 3px 0px 0px 10px;
float: left;
}
.inp input {
width: 300px;
border: 0px;
background: #e2e0e1;
}
.inps {
border: 0px;
background: url('../images/contacts_02.jpg') no-repeat;
width: 413px;
height: 163px;
padding: 3px 0px 0px 10px;
}
.inpsa {
background: #e2e0e1;
border: 0px;
width: 300px;
height: 150px;
overflow: auto;
}

.inpb {
border: 0px;
background: url('../images/sr_2.jpg') no-repeat;
width: 62px;
height: 29px;
margin: 10px 0px 0px 250px;
}
a:active, a:focus {
outline: 0;
}

#contaner {
width: 900px;
margin: 0px auto;
text-align: left;
border: 0px dashed #333;
}
#top-line {
background-image: url('../images/interface_02.jpg');
background-repeat: repeat-x;
width: 100%;
height: 24px;
}
#logo {
background-image: url('../images/logo.png');
background-position: 0px 20px;
background-repeat:no-repeat;
width: 290px;
height: 95px;
float: left;
}
#bgmenu {
background-image: url('../images/interface_29.jpg');
background-repeat: no-repeat;
width: 592px;
height: 114px;
float: left;
}
#search {
background-image: url('../images/interface_01.jpg');
background-repeat: no-repeat;
width: 100%;
height: 79px;
float: left;
}
#left-body {
width: 634px;
float: left;
padding: 5px;
}
#right-body {
width: 244px;
float: right;
padding: 5px;
}
#footers {
width: 100%;
height: 20px;
text-align: center;
float:left;
font: bold 13px tahoma;
}
#footers a {
color: #f26522;
text-decoration: none;
font: bold 13px tahoma;
}
#footers a:hover {
color: #f26522;
text-decoration: underline;
font: bold 13px tahoma;
}
#line_foot {
font: 0px tahoma;
margin-top: 5px;
margin-bottom: 5px;
float: left;
background: url('../images/interface_28.jpg');
height: 10px;
width: 900px;
}
#banner {
border: 1px solid #5c6570;
text-align: center;
height: 86px;
width: 630px;
}
#banner img {
border: 0px;
}
/*start zaoblqneto*/
b.jor, b.bot
{
display:block;
background: #ffffff;
}
b.jor b, b.bot b
{
display:block;
height: 1px;
overflow: hidden;
background: #455159;
}
b.j1 { margin: 0 5px; }
b.j2 { margin: 0 3px; }
b.j3 { margin: 0 2px; }
b.jor b.j4, b.bot b.j4 { margin: 0 1px;height: 2px; }
/*end zaoblqneto*/

#login-box {
background: #455159;
color: #ffffff;
font: normal 15px tahoma, arial;
}
#login-box-menu-log {
width: 102px;
float: left;
text-align: center;
font: normal 18px tahoma, arial;
}
#login-box-menu-log a, #login-box-menu-log a:hover {
outline: none;
color: #ffffff;
text-decoration: none;
}
#login-box-menu-reg {
width: 142px;
float: left;
text-align: center;
font: normal 18px tahoma, arial;
background: #6a747a;
}
#login-box-menu-reg a, #login-box-menu-reg a:hover {
outline: none;
color: #000000;
text-decoration: none;
}
#login-box-body {
padding: 10px;
}
#register-box-body {
padding: 10px;
}
#reklama-box {
background: #455159;
color: #ff0000;
}
#reklama-box-title {
width: 100%;
text-align: center;
color: #ffffff;
font: normal 18px tahoma, arial;
}
#reklama-box-body {
padding: 10px;
}
#reklama-box-body a {
padding-left: 20px;
padding-bottom: 4px;
display: block;
background-image: url('../images/interface_16.jpg');
background-repeat: no-repeat;
color: #ffffff;
font: normal 14px tahoma, arial;
text-decoration : none;
outline: none;
}
#reklama-box-body a:hover {
background-image: url('../images/interface_16.jpg');
background-repeat: no-repeat;
color: #ffffff;
font: normal 14px tahoma, arial;
text-decoration : none;
outline: none;
}



#reklama-box-body img {
float: left;
}
#stat-box {
background: #455159;
color: #ff0000;
}
#stat-box-title {
width: 100%;
text-align: center;
color: #ffffff;
font: normal 18px tahoma, arial;
}
#forgot, #forgot a, #forgot a:hover {
outline: none;
padding-top: 10px;
text-decoration : none;
color: #fff200;
}

.login-box-input-log {
width: 188px;
height: 22px;
border: 1px solid #22282c;
background-image: url('../images/interface_13.png');
background-repeat: no-repeat;
padding-left: 25px;
background-color: #a2a8ac;
font: normal 17px tahoma, arial;
}
.login-box-input-pas {
width: 188px;
height: 22px;
border: 1px solid #22282c;
background-image: url('../images/interface_12.png');
background-repeat: no-repeat;
padding-left: 25px;
background-color: #a2a8ac;
font: normal 17px tahoma, arial;
}
.login-box-input-forgot {
width: 188px;
height: 22px;
border: 1px solid #22282c;
background-image: url('../images/interface_14.jpg');
background-repeat: no-repeat;
padding-left: 25px;
background-color: #a2a8ac;
font: normal 17px tahoma, arial;
}
.login-box-input-submit {
margin-top: 10px;
padding-top: 3px;
text-align: center;
display: block;
background-image: url('../images/interface_11.jpg');
width: 88px;
height: 23px;
border: 0px solid;
}
.login-box-input-submit a {
display: block;
width: 88px;
height: 23px;
text-decoration : none;
color: #ffffff;
font: normal 15px tahoma, arial;
}
.login-box-input-submit a:hover {
outline: none;
text-decoration : none;
color: #ffffff;
font: normal 15px tahoma, arial;
}
.login-box-input-submit-forgot {
margin-top: 10px;
padding-top: 3px;
text-align: center;
display: block;
background-image: url('../images/interface_11.jpg');
width: 88px;
height: 23px;
border: 0px solid;
}
.div-split {
width: 100%;
height: 5px;
font: normal 0px tahoma, arial;
}
#kategorii-box {
background: #455159;
color: #ffffff;
}
#kategorii-box a {
background: #455159;
color: #ffffff;
text-decoration: none;
}
#kategorii-box a:hover {
color: #ffffff;
text-decoration: bold;
}
#cat_view {

}
/*start box radius */
.inf1 {
width: 20px;
height: 20px;
background: url('../images/interface_18.gif');
}
.inf2 {
background: url('../images/interface_19.gif');
}
.inf3 {
width: 20px;
background: url('../images/interface_20.gif');
}
.inf4 {
width: 20px;
background: url('../images/interface_25.gif');
}
.inf5 {
width: 20px;
background: url('../images/interface_21.gif');
}
.inf6 {
width: 20px;
height: 20px;
background: url('../images/interface_24.gif');
}
.inf7 {
height: 20px;
background: url('../images/interface_23.gif');
}
.inf8 {
width: 20px;
height: 20px;
background: url('../images/interface_22.gif');
}
/*end box radius */
#lang {
float: left;
width: 100px;
margin-top: 20px;
margin-left: 20px;
font: bold 15px tahoma;
}
#lang img {
border: 0px;
}
#search_input {
float: left;
margin-top: 16px;
}
#search_input #q {
margin-left: 220px;
height: 18px;
width: 430px;
border: 0px;
background: #f5d898;
}
#search_submit {
float: left;
margin-top: 16px;
}
#search_submit #s {
margin-left: 20px;
height: 22px;
width: 91px;
border: 0px;
background: #eab031 url('../images/interface_27.gif');
font: 14px tahoma;
color: #ffffff;
}
.form_ed {
border: 0px solid;
margin: 0px;
padding: 0px;
}
.menu {
margin: 40px 0px 0px 30px;
}
.menu ul {
margin: 0px;
padding: 0px;
list-style:none;
}
.menu li {
float: left;
margin-right: 10px;
width: 83px;
height: 48px;
padding: 12px 0px 0px 0px;
text-align: center;
}
.menu a {
text-decoration: none;
font: 18px tahoma;
color: #ffffff;
}
.menu .sel {
background: url('../images/interface_30.jpg') no-repeat;
}
.menu .sel a {
color: #000000;
}

Тегли си картинките от: http://gnachev.net/images/

body>
<div id="loading"></div>
<div id="contaner">
<div id="top-line"></div>
<div id="logo"></div>
<div id="bgmenu">
<div class="menu">
<ul>
<li class="sel"><a href="#page:home" onclick="MR('ch.php', '?page=home', '0');soundManager.play('beep');">Начало</a></li>

<li class="sel_no"><a href="#page:projects" onclick="MR('ch.php', '?page=projects', '1');soundManager.play('beep');">Проекти</a></li>
<li class="sel_no"><a href="#page:services" onclick="MR('ch.php', '?page=services', '2');soundManager.play('beep');">Услуги</a></li>
<li class="sel_no"><a href="#page:sell" onclick="MR('ch.php', '?page=sell', '3');soundManager.play('beep');">Цени</a></li>
<li class="sel_no"><a href="#page:contacts" onclick="MR('ch.php', '?page=contacts', '4');soundManager.play('beep');">Контакти</a></li>
</ul>
</div>
</div>

<div id="search">

</div>
 
Не това не ми върши никаква работа... ако може някой да даде код ще съм му много благодарен :cry:
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе