epsilon
forum de libre service de codage,
aucune inscription
Une refonte complète d'Epsilon est prévue pour bientôt. Dans les mois qui suivent, le forum va totalement changer d'apparence et toutes les catégories vont être réorganisées. Pas de panique, aucun LS ne va disparaître !
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
-20%
Le deal à ne pas rater :
Ecran PC GIGABYTE 28″ LED M28U 4K ( IPS, 1 ms, 144 Hz, FreeSync ...
399 € 499 €
Voir le deal

[GREEN AND HOVER]
 :: “Excellent! I cried. “Elementary,” said he ☆ :: Barre latérale
Jawn
Jawn
The relations between us in those latter days were peculiar.
The relations between us in those latter days were peculiar.
# [GREEN AND HOVER] - Lun 17 Déc - 3:16
[GREEN AND HOVER] 1514563111-menu

LE HTML : -à mettre dans le template overall_header en dessous dans la barre de navitation -
Code:

<ul id="menuki">
        <li><a href="#">Navigation</a><ul>
                        <li><a href="#">Accueil</a></li>
                        <li><a href="#">Contexte</a></li>
                        <li><a href="#">Development tools</a></li>
                        <li><a href="#">Web design</a></li>
                </ul></li>
        <li> <a href="#">Categories</a>
                <ul>
                  <li><a href="#">Annexes</a></li>
                        <li><a href="#">Graphic design</a></li>
                        <li><a href="#">Development tools</a></li>
                        <li><a href="#">Web design</a></li>
                </ul>
        </li>
</ul>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
        $(function() {
          if ($.browser.msie && $.browser.version.substr(0,1)<7)
          {
                $('li').has('ul').mouseover(function(){
                        $(this).children('ul').show();
                        }).mouseout(function(){
                        $(this).children('ul').hide();
                        })
          }
        });
</script>

LE CSS :
Code:
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(https://fonts.googleapis.com/css?family=Kaushan+Script);
@import url(https://fonts.googleapis.com/css?family=BenchNine);
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed);
@import url(https://fonts.googleapis.com/css?family=Anton);

/* Principal */
#menuki{
        margin: 0;
        padding: 10px 0 0 0;
        list-style: none;
}

#menuki li{
        float: left;
        padding: 0 0 10px 0;
        position: relative;
  font-family:'Open Sans Condensed';
}

#menuki a{
        float: left;
        height: 25px;
        padding: 0 25px;
        color: #9db9b5;
    text-transform:uppercase;
        font: bold 12px/12px;
  text-decoration:none;
  font-family:'Open Sans Condensed';
}

#menuki li:hover > a{
        color: #9db9b5;
        font-family:'Anton';
}

*html #menuki li a:hover{ /* IE6 */
        color: #9db9b5;
}

#menuki li:hover > ul{
        display: block;
         font-family:'Kaushan Script';
    background-color:lightgrey;
}

/* Sous-menu */

#menuki ul{
    list-style: none;
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    top: 35px;
    left: 0;
    z-index: 99999;
}

#menuki ul li{
    float: none;
    margin: 0;
    padding: 0;
    display: block;
}

#menuki ul li:last-child{
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#menuki ul a{
    padding: 10px;
    height: auto;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
    text-transform: none;
}

*html #menuki ul a{ /* IE6 */
        height: 10px;
        width: 150px;
}

*:first-child+html #menu ul a{ /* IE7 */
        height: 10px;
        width: 150px;
}

#menuki ul a:hover{
        background: none;
}

#menuki ul li:first-child a{
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

#menuki ul li:first-child a:after{
    content: '';
    position: absolute;
    left: 30px;
    top: -8px;
    width: 0;
    height: 0;
}

#menuki ul li:first-child a:hover:after{
    border-bottom-color: #04acec;
}

#menuki ul li:last-child a{
    border-radius: 0 0 0px 0px;
}

/* Rétablissement du flottement */
#menuki:after{
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
}

* html #menuki             { zoom: 1; } /* IE6 */
*:first-child+html #menuki { zoom: 1; } /* IE7 */
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum