Помогите разобраться со скриптом вот этой вот менюшки.
1. Она очень большая. Как её можно уменьшить? Желательно пропорционально.
2. Как можно сделать так что бы её можно было пихать в любое место сайта. А то куда не засунь всё время вверху оказывается.
Code
#container {
width: 1200px;
margin: 100px auto;
}
ul, li {
margin: 0;
padding: 0;
}
#blob {
background: #0b2b61;
border-right: 1px solid #0059ec;
border-left: 1px solid #0059ec;
position: absolute;
z-index: 1;
top: 0;
background: -moz-linear-gradient(top, #0b2b61, #1153c0);
background: -webkit-gradient(linear, left top, left bottom, from(#0b2b61), to(#1153c0));
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-moz-box-shadow: 2px 3px 10px #011331;
-webkit-box-shadow: 2px 3px 10px #011331;
}
#nav {
position: relative;
background: #292929;
float: left;
}
#nav li {
float: left;
list-style: none;
border-right: 1px solid #4a4a4a;
border-left: 1px solid black;
}
#nav li a {
color: #e3e3e3;
z-index: 2;
position: relative;
cursor: pointer;
float: left;
font-size: 30px;
font-family: helvetica, arial, sans-serif;
text-decoration: none;
padding: 30px 45px;
width: 100%;
}
Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>untitled</title>
<link href="css/style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="container">
<ul id="nav">
<li id="selected"><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">More About My Portfolio</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.spasticNav.js"></script>
<script type="text/javascript">
$('#nav').spasticNav();
</script>
</body>
</html>
