Cum pot adauga un meniu vertical pe marginea forumului?

Cum spune şi titlu aş vrea să pun un meniu vertical pe marginea forumului. Sau meniul obişnuit să îl pun pe marginea forumului......

Folosesc versiunea de forum phpbb2.

La widgeturi
PA => Module => Gestiunea widget-urilor forumului => Afiseaza widget-urile forumului : => Da

Nu alea, ca stiam de muuuult de ele. Eu vreau sa stea chiar pe marginea imagini.

Nu inteleg ce doresti fi mai explicit !

nick, nu asa vreau. Vreau sa fie iconurile fara slide. (adica fara sa se deschida)

La asta te referi?

Nu, sa fie pe partea dreapta si sa fie pe marginea din partea dreapta. O sa va fac o imagine sa intelegeti, revin cu edit.


Edit: https://i.servimg.com/u/f67/15/87/26/18/22210.jpg

Unde este "1", "2" si "3" sa fie imaginile de la meniu. si sa ramana peste tema forumului. (adica cand dai scrool jos sa nu ramana acolo)

Si eu as vrea sa stiu

Cod:

 <style type="text/css">
#navigationMenu{
   position:fixed;
        top: 10px;
        left: 0px;
}
 
#navigationMenu li{
   list-style:none;
   height:39px;
   padding:2px;
   width:40px;
}
 
#navigationMenu span{
   width:0;
   left:38px;
   padding:0;
   position:absolute;
   overflow:hidden;
 
   font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
   font-size:18px;
   font-weight:bold;
   letter-spacing:0.6px;
   white-space:nowrap;
   line-height:39px;
   
   /* CSS3 Transition: */
   -webkit-transition: 0.25s;
   /*-o-transition: 0.25s;*/
   
   /* Future proofing (these do not work yet): */
   -moz-transition: 0.25s;
   transition: 0.25s;
}
 
#navigationMenu a{
   background:url('http://img52.imageshack.us/img52/3637/navigationf.jpg') no-repeat;
 
   height:39px;
   width:38px;
   display:block;
   position:relative;
}
 
/* General hover styles */
 
#navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; }
#navigationMenu a:hover{
   text-decoration:none;
   
   /* CSS outer glow with the box-shadow property */
   -moz-box-shadow:0 0 5px #9ddff5;
   -webkit-box-shadow:0 0 5px #9ddff5;
   box-shadow:0 0 5px #9ddff5;
}
 
/* Green Button */
 
#navigationMenu .home {   background-position:0 0;}
#navigationMenu .home:hover {   background-position:0 -39px;}
#navigationMenu .home span{
   background-color:#7da315;
   color:#3d4f0c;
   text-shadow:1px 1px 0 #99bf31;
}
 
/* Blue Button */
 
#navigationMenu .about { background-position:-38px 0;}
#navigationMenu .about:hover { background-position:-38px -39px;}
#navigationMenu .about span{
   background-color:#1e8bb4;
   color:#223a44;
   text-shadow:1px 1px 0 #44a8d0;
}
 
/* Orange Button */
 
#navigationMenu .services { background-position:-76px 0;}
#navigationMenu .services:hover { background-position:-76px -39px;}
#navigationMenu .services span{
   background-color:#c86c1f;
   color:#5a3517;
   text-shadow:1px 1px 0 #d28344;
}
 
/* Yellow Button */
 
#navigationMenu .portfolio { background-position:-114px 0;}
#navigationMenu .portfolio:hover{ background-position:-114px -39px;}
#navigationMenu .portfolio span{
   background-color:#d0a525;
   color:#604e18;
   text-shadow:1px 1px 0 #d8b54b;
}
 
/* Purple Button */
 
#navigationMenu .contact { background-position:-152px 0;}
#navigationMenu .contact:hover { background-position:-152px -39px;}
#navigationMenu .contact span{
   background-color:#af1e83;
   color:#460f35;
   text-shadow:1px 1px 0 #d244a6;
}
 
 
a, a:visited,a:active {
   color:#0196e3;
   text-decoration:none;
   outline:none;
}
 
a:hover{
   text-decoration:none;
}
 
a img{
   border:none;
}
 
</style>
 
<ul id="navigationMenu">
    <li>
       <a class="home" href="forum.htm">
            <span>Home</span>
        </a>
    </li>
   
    <li>
       <a class="about" href="#">
            <span>About</span>
        </a>
    </li>
   
    <li>
       <a class="services" href="/profile.forum?mode=editprofile">
            <span>Profile</span>
        </a>
    </li>
   
    <li>
       <a class="portfolio" href="portal.htm">
            <span>Portal</span>
        </a>
    </li>
   
    <li>
       <a class="contact" href="/contact.forum">
            <span>Contact us</span>
        </a>
    </li> 
</ul>

o pui tu cum vrei mai aproape in mesaj pe pagina de start o adaugi

Mersi mult!

R@zv@n a scris:

Cod:

 <style type="text/css">
#navigationMenu{
   position:fixed;
        top: 10px;
        left: 0px;
}
 
#navigationMenu li{
   list-style:none;
   height:39px;
   padding:2px;
   width:40px;
}
 
#navigationMenu span{
   width:0;
   left:38px;
   padding:0;
   position:absolute;
   overflow:hidden;
 
   font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
   font-size:18px;
   font-weight:bold;
   letter-spacing:0.6px;
   white-space:nowrap;
   line-height:39px;
   
   /* CSS3 Transition: */
   -webkit-transition: 0.25s;
   /*-o-transition: 0.25s;*/
   
   /* Future proofing (these do not work yet): */
   -moz-transition: 0.25s;
   transition: 0.25s;
}
 
#navigationMenu a{
   background:url('http://img52.imageshack.us/img52/3637/navigationf.jpg') no-repeat;
 
   height:39px;
   width:38px;
   display:block;
   position:relative;
}
 
/* General hover styles */
 
#navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; }
#navigationMenu a:hover{
   text-decoration:none;
   
   /* CSS outer glow with the box-shadow property */
   -moz-box-shadow:0 0 5px #9ddff5;
   -webkit-box-shadow:0 0 5px #9ddff5;
   box-shadow:0 0 5px #9ddff5;
}
 
/* Green Button */
 
#navigationMenu .home {   background-position:0 0;}
#navigationMenu .home:hover {   background-position:0 -39px;}
#navigationMenu .home span{
   background-color:#7da315;
   color:#3d4f0c;
   text-shadow:1px 1px 0 #99bf31;
}
 
/* Blue Button */
 
#navigationMenu .about { background-position:-38px 0;}
#navigationMenu .about:hover { background-position:-38px -39px;}
#navigationMenu .about span{
   background-color:#1e8bb4;
   color:#223a44;
   text-shadow:1px 1px 0 #44a8d0;
}
 
/* Orange Button */
 
#navigationMenu .services { background-position:-76px 0;}
#navigationMenu .services:hover { background-position:-76px -39px;}
#navigationMenu .services span{
   background-color:#c86c1f;
   color:#5a3517;
   text-shadow:1px 1px 0 #d28344;
}
 
/* Yellow Button */
 
#navigationMenu .portfolio { background-position:-114px 0;}
#navigationMenu .portfolio:hover{ background-position:-114px -39px;}
#navigationMenu .portfolio span{
   background-color:#d0a525;
   color:#604e18;
   text-shadow:1px 1px 0 #d8b54b;
}
 
/* Purple Button */
 
#navigationMenu .contact { background-position:-152px 0;}
#navigationMenu .contact:hover { background-position:-152px -39px;}
#navigationMenu .contact span{
   background-color:#af1e83;
   color:#460f35;
   text-shadow:1px 1px 0 #d244a6;
}
 
 
a, a:visited,a:active {
   color:#0196e3;
   text-decoration:none;
   outline:none;
}
 
a:hover{
   text-decoration:none;
}
 
a img{
   border:none;
}
 
</style>
 
<ul id="navigationMenu">
    <li>
       <a class="home" href="forum.htm">
            <span>Home</span>
        </a>
    </li>
   
    <li>
       <a class="about" href="#">
            <span>About</span>
        </a>
    </li>
   
    <li>
       <a class="services" href="/profile.forum?mode=editprofile">
            <span>Profile</span>
        </a>
    </li>
   
    <li>
       <a class="portfolio" href="portal.htm">
            <span>Portal</span>
        </a>
    </li>
   
    <li>
       <a class="contact" href="/contact.forum">
            <span>Contact us</span>
        </a>
    </li> 
</ul>

o pui tu cum vrei mai aproape in mesaj pe pagina de start o adaugi

Merge, multumesc. Dar as vrea unul care sa nu se deschisa asa. Sa fie doar imaginea care se aprinde cand pui cursorul pe ea. (adica de ex. din negru sa devina gri)