Hover Menu Bar

Pagina 1 din 2 1, 2  Urmatorul

Vezi subiectul anterior Vezi subiectul urmator In jos

Rezolvat Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mar 26 Dec - 0:28

Buna seara,

As dori si eu un cod CSS pentru PHPBB3 pentru meniul de navigare . Am nevoie ca in momentul cand o persoana se afla cu   pointer-ul mouse-ului peste o imagine in meniu acestei persoane sa ii arate alta imagine . Ceva gen cum este la meniul din acest forum numai ca in loc de chenarul ce apare aici eu vreau sa apara alta imagine pentru butonul respectiv .
Sau daca nu se poate sa imi oferiti o metoda prin care sa pot modifica fontul meniului respectiv sa adaug un hover tip chenar transparent fara border .Multumesc anticipat pentru raspuns

DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de Lucifer la data de Mar 26 Dec - 16:56

Aveţi un meniu anume care îl doriţi sau un model ?

Lucifer
Moderator
Moderator

Mesaje : 897
Varsta : 16
Localizare : Constanţa
Data înscrierii : 21/05/2016
Multumiri : 111
Niciun avertisment

Vezi profilul utilizatorului https://www.fgdesign.biz/

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mar 26 Dec - 19:42

Gen meniul acestui forum numai ca eu vreau sa folosesc alt tip de font http://narnia.forums-rpg.com/forum

DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de Lucifer la data de Mar 26 Dec - 19:48

Vrei acel meniu de acolo ? O sa trebuiasca link de la forumul dv .

Lucifer
Moderator
Moderator

Mesaje : 897
Varsta : 16
Localizare : Constanţa
Data înscrierii : 21/05/2016
Multumiri : 111
Niciun avertisment

Vezi profilul utilizatorului https://www.fgdesign.biz/

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mar 26 Dec - 19:51

Acesta este link-ul forumului meu : http://khronosroseclan.forumotion.com/
Da vreau meniu ca acel forum numai ca vreau sa folosesc alt tip de font, acest tip de font http://www.1001fonts.com/voice-activated-bb-font.html

DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de SSYT la data de Mar 26 Dec - 19:59

Buna seara,

Va recomand sa va alegeti un font de aici, dupa care o sa va ofer codul necesar cerut de dvs.
https://fonts.google.com.
avatar
SSYT
Membru onorific
Membru onorific

Mesaje : 1423
Varsta : 24
Localizare : France, Aisne
Data înscrierii : 10/08/2015
Multumiri : 199
Niciun avertisment

Vezi profilul utilizatorului https://help.forumgratuit.ro

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mar 26 Dec - 20:05


DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de SSYT la data de Mar 26 Dec - 20:28

Buna seara,
Intrati in:
Panou de administrare => Afisare => Imagini si culori => Culori => Foaie de stil css

Si adaugati:
Cod:

@import url('https://fonts.googleapis.com/css?family=Audiowide');
a.mainmenu:nth-child(1):hover {
    font-size: 0;
}

a.mainmenu:nth-child(1):hover:before {
    content: "Home";
    font-family: 'Audiowide', cursive;
    font-size: 24px;
}

Si spuneti-mi daca este ok asa? Sau doriti un alt efect.
Am facut doar pentru butonul Acasa ("Home")
avatar
SSYT
Membru onorific
Membru onorific

Mesaje : 1423
Varsta : 24
Localizare : France, Aisne
Data înscrierii : 10/08/2015
Multumiri : 199
Niciun avertisment

Vezi profilul utilizatorului https://help.forumgratuit.ro

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mar 26 Dec - 20:35

Daca se poate sa fie din prima scrisul la aceeasi marime iar culoarea sa fie ceva mai opaca gen forumul de mai sus ar fi perfect . Daca doriti v-as putea oferi intreg  css-ul forumului respectiv .
Edit:
Acesta e css forumului respectiv :
Cod:
.overlay {
    margin-top:100px;
    width:130px;
    height:180px;
    background-color:black;
    opacity:0;
}
body {
background-repeat: repeat;
  text-align:left;
}

a { text-decoration: none; }
a:hover{
    text-decoration: none !important;
    color : #ffffff;
    }

img {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}


body
{
  opacity: 0.83
   
}

.name{
font-weight: lighter;
font-size: 12px;
 letter-spacing: -1px;
text-decoration: none;
font-family: Verdana;
    text-transform: lowercase;
      color: transparent;
 


}


.name:hover {
font-family: Verdana;
  font-size: 12px;
  text-transform: lowercase;
 letter-spacing: 1px;
  font-weight: lighter;
    background-image:url('')
}



.avatar.mini, .avatar.mini img {
height: 100px;
width: 72px;
}


.forumlink {
font:14px arial;
font-style: italic;
text-align:  center;
text-transform: lowercase;
letter-spacing: 1px;
line-height:150%;
text-shadow: 2px 2px 2px #;
}

.forumlink:hover {
  background-image:url('');
 
}



a.mainmenu{
text-decoration: none;
text-transform: uppercase;
font: 12px verdana; 
text-shadow: 2px 2px 2px #;
color :
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
 
transition: background 1s;
-webkit-transition: background 1000ms;
-moz-transition: background 1000ms;
-o-transition: background 1000ms;

   
}


a.mainmenu:hover {
  font-style: italic;
background: transparent;
background: url() repeat;
/* TRANSISITION */
transition: background 1000ms;
-webkit-transition: background 1000ms;
-moz-transition: background 1000ms;
-o-transition: background 1000ms;
}



a.cattitle {
display:block;
font: 18px Bad Script;
color: #7a6565;
font-style: bold;
font-weight: normal;
text-align: center;
text-transform: lowercase;
letter-spacing: 1px;
line-height:25%;
text-shadow: 1px 1px 0px #;
}



.bodyline{
  -webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15x;}

a img {
border: none;
position: left;
}

img:hover
{opacity:0.8;
filter:alpha(opacity=80); /* For IE8 and earlier */
}

.bodyline {
opacity:1.0;
filter:alpha(opacity=100);
background-image: url();
background-repeat: repeat;
}

a.gen, a.genmed, a.gensmall {
text-decoration: none;
text-transform: uppercase;
font: 12px calibri; 
text-shadow: 1px 1px 0px #;
color : #8b746f;

}

a.gen, a.genmed, a.gensmall:hover {
  background-image:url('');
  font-style: italic;
}


@font-face {
  font-family: 'Bad Script';
  font-style: normal;
  font-weight: 400;
  src: local('Bad Script Regular'), local('BadScript-Regular'), url(http://themes.googleusercontent.com/static/fonts/badscript/v2/rL_b2ND61EQmMOJ8CRr1fhsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
}



@font-face {
  font-family: 'Handlee';
  font-style: normal;
  font-weight: 400;
  src: local('Handlee Regular'), local('Handlee-Regular'), url(http://themes.googleusercontent.com/static/fonts/handlee/v2/6AfIXNH5pZ1Jj_pfExPOWQ.woff) format('woff');
}

td.cat, td.catBottom, td.catHead, td.catLeft, td.catRight, td.catSides {
border-image: initial;
height: 20px;
}

.postdetails.poster-profile span.label {
white-space: nowrap;
font: 11px helvetica; 
}

a.topictitle{
text-decoration: initial;
font: 12px orator std;
text-transform: lowercase;}

    /* MISE EN FORME DES CATEGORIES ET FORUMS */

    .cate_titre
    {
      clear: both;
      height: 100px;
      margin-top: 50px;
    }
    .catetitre_bloc
    {
    position: relative;
    z-index: 1;
    display: block;
    width: 70%;
    height: 18px;
    margin-left: auto;
    margin-right : auto;
   
    }
    .catetitre_content
    {
    position: absolute;
    z-index: 2;
    display: block;
    width: 950px;
    margin-left: auto;
      margin-right: auto;
      margin-top: -40px;
    text-align: center;
    padding: 2px;
      border-bottom: 3px dotted #191817;
    }
    .catetitre
    {
    color: #454545;
    font-family: arial;
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 1px 1px 0px #000000;
    }

    .forum_bloc
    {
      width: 950px;
      margin-left: auto;
      margin-right: auto;
      margin-top: -30px;
    }
    .forum
    {
    float: left;
    width: 450px;
    height: 250px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 50px;
    }
    a.forumlink
    {
      position: relative;
      z-index: 1;
      display: block;
      width: 50%;
      color: #454545;
      text-align: left;
    font-family: arial;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0px 0px 0px #000000;
        transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    a.forumlink:hover
    {
      letter-spacing: 4px;
        transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .forum_contenu
    {
      position: relative;
      z-index: 1;
      width: 98%;
      height: 90%;
      padding: 4px;
      margin-left: auto;
      margin-right: auto;
      margin-top: -8px;
      background-color: ;
      border-left: 5px dotted #191817;
      border-right: 5px dotted #191817;
      border-bottom: 5px dotted #191817;
      border-top: 5px dotted #191817;
    }
    .description
    {
      display: block;
      width: 260px;
      margin: auto;
      height: 80px;
      overflow: hidden;
      border: 5px solid #9c9c9c;
      box-shadow: 1px 1px 1px #191817;
      -moz-box-shadow: 1px 1px 1px #191817;
      -htm-box-shadow: 1px 1px 1px #191817;
      -webkit-box-shadow: 1px 1px 1px #191817;
      -o-box-shadow: 1px 1px 1px #191817;
    }
    .description_contenu
    {
      position: absolute;
      display: block;
      width: 251px;
      height: 71px;
      overflow: auto;
      background-color: #191817;
      font-size: 12px;
      color: #9c9c9c;
      text-align: center;
      padding: 5px;
      opacity: 0;
      -moz-opacity: 0;
      -khtml-opacity: 0;
      filter: alpha(opacity=0);
      transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .description_contenu:hover
    {
      opacity: 0.8;
      -moz-opacity: 0.8;
      -khtml-opacity: 0.8;
      filter: alpha(opacity=80);
      transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .icone_stats
    {
      width: 300px;
      margin: auto;
      margin-top: -30px;
    }
    .stats_lastpost
    {
      display: block;
      width: 160px;
      height: 80px;
      margin-left: 10px;
      background-color: ;
      border: 1px solid #b5b5b5;
      padding: 5px;
      text-align: center;
    }
    .stats
    {
      display: block;
      margin-bottom: 5px;
      border-bottom: 1px dotted #b5b5b5;
      padding-bottom: 5px;
      font-size: 12px;
      color: #8f8f8f;
    }
    .lastpost
    {
      display: block;
      font-size: 12px;
    }
    .sforum
    {
      position: relative;
      z-index: 3;
      display: block;
      height: 0;
        background: #191817;
      color: #b5b5b5;
      overflow: hidden;
        transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .ouverture_sousforum
    {
      position: relative;
      z-index: 3;
      display: block;
      float: right;
      width: 120px;
      margin-right: 20px;
      background: #191817;
      color: #b5b5b5;
      font-size: 12px;
      text-align: center;
      padding: 4px;
      -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    }
    .sous_forum:hover .sforum
    {
      height: 50px;
      background: #191817;
      color: #b5b5b5;
      padding: 4px;
      overflow: auto;
        transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .sous_forum a
    {
      color: #b5b5b5 !important;
      text-shadow: 1px 1px 0px #000000;
    }
    .sous_forum a:hover
    {
      color: #ffffff !important;
    }

    .qeel_titre
    {
      width: 890px;
      height: 100px;
      background: url(#);
    }
    .qeel
    {
      width: 890px;
      height: 400px;
      background: url(#);
    }
    .qeel_table
    {
      width: 612px;
      margin: auto;
    }
    .colonne
    {
      position: absolute;
      z-index: 1;
      width: 200px;
      height: 300px;
      overflow: auto;
      margin-top: 0px;
      margin-left: 0px;
      background: #4b4545;
      border: 5px solid #3f4d55;
      box-shadow: 0px 0px 0px #0d1418;
      -moz-box-shadow: 0px 0px 0px #0d1418;
      -o-box-shadow: 0px 0px 0px #0d1418;
      -htm-box-shadow: 0px 0px 0px #0d1418;
      -webkit-box-shadow: 0px 0px 0px #0d1418;
      font-size: 12px;
      opacity: 0.5;
      -moz-opacity: 0.5;
      -khtml-opacity: 0.5;
      filter: alpha(opacity=50);
      transition: 1s;
      -moz-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -o-transition: 1s;
    }
    .colonne:hover
    {
      position: absolute;
      z-index: 99;
      width: 300px;
      height: 400px;
      margin-top: -50px;
      margin-left: -50px;
      background: #4b4545;
      border: 1px solid #3f4d55;
      box-shadow: 0px 0px 5px #0d1418;
      -moz-box-shadow: 0px 0px 5px #0d1418;
      -o-box-shadow: 0px 0px 5px #0d1418;
      -htm-box-shadow: 0px 0px 5px #0d1418;
      -webkit-box-shadow: 0px 0px 5px #0d1418;
      font-size: 12px;
      opacity: 0.8;
      -moz-opacity: 0.8;
      -khtml-opacity: 0.8;
      filter: alpha(opacity=80);
      transition: 1s;
      -moz-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -o-transition: 1s;
    }
    .qeel_contenu
    {
      display: block;
      text-align: justify;
      padding: 10px;
    }

        .avatar_mess
    {
      display: block;
      width: 200px;
      height: 320px;
      margin-left: -10px;
      margin-right: 10px;
      overflow: hidden;
      background: #272726;
      border: 5px solid #3e1d19;
      transform: rotate(-5deg);
      -moz-transform: rotate(-5deg);
      -o-transform: rotate(-5deg);
      -ms-transform: rotate(-5deg);
      -htm-transform: rotate(-5deg);
      -webkit-transform: rotate(-5deg);
      box-shadow: 1px 1px 6px #000000;
      -moz-box-shadow: 1px 1px 6px #000000;
      -o-box-shadow: 1px 1px 6px #000000;
      -htm-box-shadow: 1px 1px 6px #000000;
      -webkit-box-shadow: 1px 1px 6px #000000;
          transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .avatar_mess:hover
    {
      margin-left: 5px;
      transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -htm-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
          transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .profil_mess
    {
      position: absolute;
      display: block;
      width: 190px;
      height: 310px;
      margin: auto;
      padding: 5px;
      overflow: auto;
      background: #202020 ;
      color: ;
      font-size: 12px;
      opacity: 0;
      -moz-opacity: 0;
      -khtml-opacity: 0;
      filter: alpha(opacity=0);
          transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .profil_mess:hover
    {
      opacity: 1;
      -moz-opacity: 1;
      -khtml-opacity: 1;
      filter: alpha(opacity=100);
          transform: all;
    -moz-transform: all;
    -o-transform: all;
    -htm-transform: all;
    -webkit-transform: all;
    transition: 1s;
    -moz-transition: 1s;
    -o-transition: 1s;
    -htm-transition: 1s;
    -webkit-transition: 1s;
    }
    .pseudo_mess
    {
      display: block;
      position: relative;
      z-index: 2;
      width: 190px;
      margin-top: -15px;
      margin-left: 10px;
      text-align: center;
      font-size: 12px;
      font-family: arial;
      font-weight: ;
      text-shadow:  ;
      background: #202020  ;
      padding-top: 5px;
      border-left: 3px solid #371e1a;
      border-right: 3px solid #371e1a;
      border-top: 1px solid #371e1a;
      border-bottom: 1px solid #371e1a;
      box-shadow: ;
      -moz-box-shadow:  ;
      -o-box-shadow:  ;
      -htm-box-shadow:  ;
      -webkit-box-shadow:  ;
    }


    /* PAGE ACCUEIL FORME 1 */

    #f1_accueil
    {
      width: 800px;
      height: 500px;
      margin: auto;
      background: url(http://img15.hostingpics.net/pics/891324imageexemplePA.jpg);
      text-shadow: none !important;
    }
    #f1_accueil a
    {
      color: #ba8550 !important;
      text-shadow: none !important;
    }
    #f1_accueil a:hover
    {
      color: #e58f3a !important;
      text-shadow: none !important;
    }
    .f1_col1
    {
      width: 300px;
      vertical-align: top;
    }
    .f1_contexte
    {
      width: 220px;
      height: 300px;
      overflow: auto;
      margin-top: 100px;
      margin-left: 65px;
      text-align: justify;
      color: #7e6144;
      text-shadow: 1px 1px 0px #ffffff;
    }
    .f1_bloconglets
    {
      margin-top: 80px;
    }
    .f1_onglet1, .f1_onglet2, .f1_onglet3
    {
      display: inline-block;
      width: 110px;
      height: 50px;
    }
    .f1_onglet1
    {
      margin-left: 50px;
      margin-right: 25px;
    }
    .f1_onglet2
    {
      margin-right: 30px;
    }
    .f1_contenu1, .f1_contenu2, .f1_contenu3
    {
      position: absolute;
      width: 0px;
      height: 220px;
      margin-top: 40px;
      padding-top: 40px;
      overflow: hidden;
      font-size: 12px;
      color: #7e6144;
    }
    .f1_contenu1
    {
      margin-left: -10px;
    }
    .f1_contenu2
    {
      margin-left: -149px;
    }
    .f1_contenu3
    {
      margin-left: -294px;
    }
    .f1_onglet1:hover .f1_contenu1, .f1_onglet2:hover .f1_contenu2, .f1_onglet3:hover .f1_contenu3
    {
      width: 400px;
    }
    .f1_liens
    {
      display: block;
      text-align: center;
    }
    .f1_liens a
    {
      font-size: 16px;
      font-weight: bold;
    }
    .f1_news, .f1_friends
    {
      width: 200px;
      height: 200px;
      overflow: hidden;
      text-align: justify;
    }
    .f1_credits, .f1_topsites
    {
      height: 150px;
      border-left: 1px solid #d19962;
      margin-left: 5px;
      padding: 5px;
      text-align: center;
    }
    .f1_staff1, .f1_staff2, .f1_staff3
    {
      display: block;
      width: 50px;
      height: 50px;
      background: url() #d19962;
      margin-bottom: 20px;
      margin-top: 20px;
      border: 1px solid #d19962;
    }
    .f1_staffcontenu1, .f1_staffcontenu2, .f1_staffcontenu3
    {
      position: absolute;
      width: 0px;
      height: 150px;
      background: #ffffff;
      margin-left: 80px;
      overflow: hidden;
    }
    .f1_staffcontenu2
    {
      margin-top: -72px;
    }
    .f1_staffcontenu3
    {
      margin-top: -144px;
    }
    .f1_staff1:hover .f1_staffcontenu1, .f1_staff2:hover .f1_staffcontenu2, .f1_staff3:hover .f1_staffcontenu3
    {
      width: 300px;
      border: 1px solid #d19962;
    }

   
 
    /* PAGE ACCUEIL MOZAIK */

    #mozaik
    {
      width: 660px;
      height: 260px;
      margin: auto;
    }
    #mozaik a
    {
      font-weight: bold;
      color: #575757 !important;
      text-decoration: none !important;
    }
    #mozaik a:hover
    {
      color: #3a3a3a;
      text-decoration: none !important;
    }
    #mozaik_top
    {
      position: relative;
      z-index: 1;
      width: 30px;
      height: 238px;
      overflow: hidden;
      margin-top: 10px;
      float: left;
      background: #b9b9b9;
      border: 1px solid #d6d6d6;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_top:hover
    {
      position: relative;
      z-index: 999;
      width: 330px;
      background: #d6d6d6;
      border: 1px solid #e3e3e3;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_credits
    {
      position: relative;
      z-index: 1;
      width: 30px;
      height: 238px;
      overflow: hidden;
      margin-top: 10px;
      float: right;
      background: #b9b9b9;
      border: 1px solid #d6d6d6;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_credits:hover
    {
      position: relative;
      z-index: 999;
      width: 330px;
      background: #d6d6d6;
      border: 1px solid #e3e3e3;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_titretop
    {
      display: block;
      width: 30px;
      height: 238px;
      float: left;
      overflow: hidden;
      background-color: transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_top:hover .mozaik_titretop
    {
      background-color: #9e9e9e;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_titrecredits
    {
      display: block;
      width: 30px;
      height: 238px;
      float: right;
      overflow: hidden;
      background-color: transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_credits:hover .mozaik_titrecredits
    {
      background-color: #9e9e9e;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik_accueil
    {
      width: 600px;
      height: 240px;
      margin: auto;
      padding: 10px;
      text-align: justify;
    }
    #mozaik1
    {
      position: absolute;
      z-index: 1;
      width: 300px;
      height: 120px;
      overflow: hidden;
      background: #dcd3ce;
      border-left: 3px solid #9e3535;
      box-shadow: 2px 2px 2px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik1:hover
    {
      z-index: 999;
      width: 600px;
      height: 240px;
      background: #dcdcdc;
      border-left: 0px solid #9e3535;
      box-shadow: 2px 2px 5px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik2
    {
      position: absolute;
      z-index: 1;
      width: 300px;
      height: 120px;
      overflow: hidden;
      background: #af6342;
      border-right: 3px solid #3b5d94;
      box-shadow: 2px 2px 2px #000000;
      margin-left: 300px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik2:hover
    {
      z-index: 999;
      width: 600px;
      height: 240px;
      margin-left: 0px;
      background: #dcdcdc;
      border-right: 0px solid #3b5d94;
      box-shadow: 2px 2px 5px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik3
    {
      position: absolute;
      z-index: 1;
      width: 300px;
      height: 120px;
      overflow: hidden;
      background: #392823;
      border-left: 3px solid #392823;
      box-shadow: 2px 2px 2px #000000;
      margin-top: 120px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik3:hover
    {
      z-index: 999;
      width: 600px;
      height: 240px;
      margin-top: 0px;
      background: #dcdcdc;
      border-left: 0px solid #392823;
      box-shadow: 0px 0px 5px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik4
    {
      position: absolute;
      z-index: 1;
      width: 300px;
      height: 120px;
      overflow: hidden;
      background: #d7d1a0;
      border-right: 3px solid #c4863b;
      box-shadow: 0px 0px 0px #000000;
      margin-left: 300px;
      margin-top: 120px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik4:hover
    {
      z-index: 999;
      width: 600px;
      height: 240px;
      margin-left: 0px;
      margin-top: 0px;
      background: #dcdcdc;
      border-right: 0px solid #c4863b;
      box-shadow: 0px 0px 5px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }

    .mozaik_titre1
    {
      width: 300px;
      height: 120px;
      background: url(http://feb.imghost.us/Fmk9.png) top left no-repeat transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik1:hover .mozaik_titre1
    {
      width: 600px;
      height: 60px;
      background: url(http://feb.imghost.us/Fmk9.png) top left no-repeat #dcd3ce;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_titre2
    {
      width: 300px;
      height: 120px;
      background: url(http://feb.imghost.us/FmX3.png) top left no-repeat transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik2:hover .mozaik_titre2
    {
      width: 600px;
      height: 60px;
      background: url(http://feb.imghost.us/FmX3.png) top left no-repeat #9c452a;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_titre3
    {
      width: 300px;
      height: 120px;
      background: url(http://feb.imghost.us/GAcy.png) top left no-repeat transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik3:hover .mozaik_titre3
    {
      width: 600px;
      height: 60px;
      background: url(http://feb.imghost.us/GAcy.png) top left no-repeat #392823;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_titre4
    {
      width: 300px;
      height: 120px;
      background: url(http://feb.imghost.us/FmcN.png) top left no-repeat transparent;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    #mozaik4:hover .mozaik_titre4
    {
      width: 600px;
      height: 60px;
      background: url(http://feb.imghost.us/FmcN.png) top left no-repeat #c4863b;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }

    .mozaik_contenu
    {
      width: 98%;
      margin-left: auto;
      margin-right: auto;
      margin-top: 5px;
      height: 160px;
      overflow: auto;
      font-size: 12px;
      color: #7d7d7d;
      text-shadow: 1px 1px 0px #f1f1f1;
    }
    .mozaik_contenu2
    {
      width: 280px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 5px;
      height: 220px;
      overflow: auto;
      font-size: 12px;
      font-weight: bold;
      text-transform: uppercase;
      text-align: center;
      color: #7d7d7d;
      text-shadow: 1px 1px 0px #f1f1f1;
    }
    .mozaik_contenu3
    {
      width: 280px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 5px;
      height: 220px;
      overflow: auto;
      font-size: 12px;
      font-style: italic;
      text-align: left;
      color: #7d7d7d;
      text-shadow: 1px 1px 0px #f1f1f1;
    }
    .mozaik_illu
    {
      width: 150px;
      float: left;
      border: 5px solid #ffffff;
      margin: 5px;
    }
    .mozaik_news
    {
      margin: 5px;
      padding-bottom: 5px;
      border-bottom: 1px solid #3b5d94;
    }
    .mozaik_datenews
    {
      display: inline-block;
      font-size: 12px;
      font-weight: bold;
      color: #3b5d94;
      margin-right: 20px;
    }
    .mozaik_avatar
    {
      position: relative;
      z-index: 1;
      display: inline-block;
      width: 80px;
      height: 150px;
      overflow: hidden;
      border: 2px solid #9e9e9e;
      box-shadow: 2px 2px 2px #000000;
      opacity: 0.5;
      -moz-opacity: 0.5;
      -khtml-opacity: 0.5;
      filter: alpha(opacity=50);
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_avatar:hover
    {
      position: relative;
      z-index: 999;
      display: inline-block;
      width: 150px;
      height: 150px;
      overflow: hidden;
      border: 2px solid #9e9e9e;
      box-shadow: 0px 0px 5px #000000;
      opacity: 1;
      -moz-opacity: 1;
      -khtml-opacity: 1;
      filter: alpha(opacity=100);
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_avatardescr
    {
      display: block;
      background: url(http://img15.hostingpics.net/pics/301068noir50.png);
      margin-top: 150px;
      height: 150px;
      overflow: auto;
      color: #e4e4e4;
      font-size: 12px;
      line-height: 12px;
      text-shadow: 1px 1px 0px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_avatar:hover .mozaik_avatardescr
    {
      margin-top: 130px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_avatardescr:hover
    {
      margin-top: 0px !important;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_avatartitre
    {
      display: block;
      text-align: center;
      font-size: 12px;
      font-weight: bold;
      text-transform: uppercase;
      margin-bottom: 10px;
    }
    .mozaik_predef
    {
      clear: both;
      display: block;
      height: 60px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_predef:hover
    {
      display: block;
      height: 60px;
      box-shadow: 0px 0px 5px #000000;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
      -ms-transition: 1s;
    }
    .mozaik_predef a
    {
      text-transform: uppercase;
      color: #52400a !important;
      text-decoration: none !important;
      text-shadow: 1px 1px 0px #ffffff;
    }
    .mozaik_predef a:hover
    {
      text-decoration: none !important;
    }
    .predef_icone
    {
      display: block;
      float: left;
      width: 50px;
      height 50px;
      overflow: hidden;
      margin: 5px;
      border: 2px solid #9e9e9e;
    }
    .predef_icone img
    {
      width: 50px;
    }
    .predef_nom
    {
      display: block;
      font-size: 12px;
      font-weight: bold;
      text-transform: uppercase;
      color: #937723;
    }

    #navig
    {
      width: 950px;
      margin: auto;
      text-align: center;
    }

    /* ONGLET DEVOILE EN CLIC */

    #target_onglet, #target_onglet2
    {
      position: fixed;
    }
    #onglet_clic
    {
      position: fixed;
      z-index: 999;
      width: 342px;
      height: 200px;
      margin-left: -310px;
      margin-top: 100px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }
    #onglet_contenu
    {
      width: 290px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 5px;
      height: 190px;
      color: #1e466c;
      font-size: 12px;
    }
    .onglet_clic_navigation
    {
      display: block;
      float: right;
      width: 40px;
      height: 120px;
      overflow: hidden;
      background: url(http://img15.hostingpics.net/pics/974397ongletouvrir.png);
      margin-top: 40px;
    }
    .onglet_ouvrir
    {
      position: absolute;
      z-index: 3;
    }
    .onglet_fermer
    {
      position: absolute;
      z-index: 2;
    }
    #onglet_clic_contenu
    {
      width: 300px;
      height: 200px;
      overflow: hidden;
      background: #72a3cc;
      border: 1px solid #2f6ea5;
    }
    #target_onglet:target #onglet_clic
    {
      margin-left: -10px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }
    #target_onglet:target .onglet_ouvrir
    {
      z-index: 1;
    }
    #target_onglet2:target #onglet_clic
    {
      margin-left: -310px;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }

DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de mr.franta la data de Mier 27 Dec - 7:39

Buna dimineata,cautati acest cod in overal_header
Cod:
<div id="pun-head">
                  <div id="pun-navlinks">
                     <ul class="clearfix">
                        <li>{GENERATED_NAV_BAR}</li>
                     </ul>
                  </div>
               </div>
Il stergeti si il inlocuiti cu acesta:
Cod:
<center> <meniu class="fornarnia" {MENU_POSITION}"{MENU_NOWRAP}">
                      <a href="/forum">Acasa </a>
                          <a href="/faq">Faq</a>
                          <a href="/memberlist">Membri </a>
                          <a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;">Cautare </a>
                                       <!-- BEGIN switch_user_logged_in -->
                      <a href="/privmsg?folder=inbox">{PRIVATE_MESSAGE_INFO}</a>
                     
                          <a href="/profile?mode=editprofile">Profil</a>
                                         <!-- END switch_user_logged_in -->
                         <!-- BEGIN switch_user_logged_out -->
                            <a href="/login">Conectare </a>
                     
                            <a href="/login?logout">Inregistrare</a>
                         <!-- END switch_user_logged_out -->
                     
                         <!-- BEGIN switch_user_logged_in -->
                      <a href="/login?logout">Deconectare</a>
                         <!-- END switch_user_logged_in -->
                          </meniu>
                          </center>
Salvati si publicati template-ul.
Apoi in css acest cod
Cod:
   
@import url('https://fonts.googleapis.com/css?family=Audiowide');
meniu.fornarnia a{
  font-family: 'Audiowide', cursive;
    font-size: 22px;
float: left;
  margin: 0px 6px;
  padding: 2px 4px;
  color: brown!important;
  text-decoration: none!important;
}
 
  meniu.fornarnia a:hover{
  color: #069!important;
  }
 
avatar
mr.franta
Membru onorific
Membru onorific

Mesaje : 1310
Varsta : 30
Localizare : Giurgiu
Data înscrierii : 18/02/2012
Multumiri : 114
Niciun avertisment

Vezi profilul utilizatorului http://www.frannnta-design.com/

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de DragoMuseveni la data de Mier 27 Dec - 12:18

Buna dimineata
Codul respectiv mi l-ati oferit pentru punbb iar eu am nevoie pentru phpbb3 iar codul respectiv este de la forumul narnia iar eu am nevoie pentru forumul khronos

DragoMuseveni
Membru Forumgratuit

Mesaje : 54
Varsta : 22
Data înscrierii : 05/07/2013
Multumiri : 0
Niciun avertisment

Vezi profilul utilizatorului http://ratekevfire.forumgratuit.ro/forum

Sus In jos

Rezolvat Re: Hover Menu Bar

Mesaj Scris de mr.franta la data de Mier 27 Dec - 20:32

Versiunea nu conteaza la acel meniu,credeam ca aveti punbb.
Cautati in overal_header acest cod
Cod:
<div class="navbar">
         <div class="inner"><span class="corners-top"><span></span></span>

         <ul class="linklist navlinks{NAVBAR_BORDERLESS}">
         <li>{GENERATED_NAV_BAR}</li>
         </ul>

         <!-- BEGIN switch_search_box -->
         <div id="search-box">
            <form method="get" action="{ACTION_SEARCH}" id="search">
               <p class="nomargin"><input type="text" name="search_keywords" id="keywords" maxlength="128" class="inputbox search" value="{L_SEARCH}..." onclick="if (this.value == '{L_SEARCH}...') this.value = '';" onblur="if (this.value == '') this.value = '{L_SEARCH}...';" />
               {JS_SESSION_ID_INPUT}
               <input class="button2" type="submit" value="{L_SEARCH}" /></p>
            </form>
         </div>
         <!-- END switch_search_box -->

         <span class="corners-bottom"><span></span></span></div>
      </div>

Si puneti meniu de la mine.
Nu faceti modificari,nu schimbati versiunea doar asteptati instructiunile date de noi.
Va asteptam totusi cu un print screen si link cu forumul folosit de dumneavoastra.
avatar
mr.franta
Membru onorific
Membru onorific

Mesaje : 1310
Varsta : 30
Localizare : Giurgiu
Data înscrierii : 18/02/2012
Multumiri : 114
Niciun avertisment

Vezi profilul utilizatorului http://www.frannnta-design.com/

Sus In jos

Pagina 1 din 2 1, 2  Urmatorul

Vezi subiectul anterior Vezi subiectul urmator Sus


Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum