30.07.2012, 21:31
wersja skryptu MyBB: 1.6.8
adres forum: localhost ;/
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Cześć, chciałbym aby menu przystosowało się pod każdą rozdzielczość ekranu.
header:
global.css:
adres forum: localhost ;/
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Cześć, chciałbym aby menu przystosowało się pod każdą rozdzielczość ekranu.
header:
Kod:
<div id="container">
<a name="top" id="top"></a>
<div id="header">
<div class="menu">
<div class="wrap">
<form method="post" class="searchform" action="{$mybb->settings['bburl']}/search.php">
<input type="hidden" name="action" value="do_search" />
<input type="hidden" name="postthread" value="1" />
<input type="hidden" name="forums" value="all" />
<input type="hidden" name="showresults" value="threads" />
<input type="text" class="searchbox" name="keywords" value="Przeszukaj forum..." onblur="this.value = this.value || this.defaultValue; this.style.color = '#1a94b9';" onfocus="this.value=''; this.style.color = '#fff';" />
<input type="submit" class="searchsub" value="Szukaj" />
<a href="{$mybb->settings['bburl']}/search.php" style="float:right; position: relative; bottom: 30px; right: 32px;"><img src="{$theme['imgdir']}/zaawansowane_szukanie.png" alt="Zaawansowane szukanie" title="Zaawansowane szukanie" /></a>
<div style="float:right; position: relative; bottom: 30px; left: 77px;"><a href="#" id="toggler">
<img src="{$theme['imgdir']}/przycisk_szukaj.png" alt="change background" title="change background image"/>
</a>
</div>
</form>
</div>
<ul id="navMenu">
<li><a href="{$mybb->settings['bburl']}/portal.php" style="margin-left: 5px;">Strona główna</a></li>
<li><a href="{$mybb->settings['bburl']}/index.php">Forum</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php">Userzy</a></li>
<li><a href="{$mybb->settings['bburl']}/showteam.php">Zespół</a></li>
<li><a href="{$mybb->settings['bburl']}/tut.php">Tut</a></li>
<li><a href="{$mybb->settings['bburl']}/point.php?action=point">Point</a></li>
</ul>
</div>
<br>
<navigation>
<div id="login">
<div id="login-slide">
<div id="login-content">
{$welcomeblock}
</div>
</div>
<div id="login-toggle">
<p>Panel</p>
<p style="display: none;"><img class="close" src="{$theme['imgdir']}/close.png" alt="" />Ukryj panel</p>
</div>
</div>
</div>
<br />
<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
<hr class="hidden" />
</div>
<br />
<hr class="hidden" />
<br class="clear" />
<div id="content">
{$pm_notice}
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
<br />global.css:
Kod:
.menu {
background: url(images/samp/menu_body.png) repeat-x;
width: 1000px;
height: 40px;
margin: -10px 0 0 -10px;
font-family: springsteel;
font-size: 15px;
box-shadow: 0px 2px 4px 0px #7FA2AB;
border-radius: 10px;
z-index: 2;
position: relative;
position: fixed;
}
#navMenu {
margin: 0;
padding: 0;
list-style: none;
text-align: center;
line-height: 40px;
}
#navMenu li {
float:left;
width:110px; /* width and height of the menu item */
height:40px;
position:relative; /* must set it as relative, because .hover class top and left with absolute position will be positioned according to li. */
}
#navMenu li a {
color: #fff;
z-index: 20;
display: block;
height: 40px;
position: relative;
text-shadow: 1px 1px 2px #063B4A;
text-decoration: none;
font-weight: bold;
}
#navMenu li .hover {
background: url(images/samp/over.png) no-repeat center center;
width: 110px;
position: absolute;
height: 40px;
left: 0;
top: 0;
z-index: 0;
display: none;
text-decoration: none;
}