IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Création menu style Oracle.com


Sujet :

CSS

  1. #1
    Membre extrêmement actif

    Homme Profil pro
    Software Developer
    Inscrit en
    Mars 2008
    Messages
    1 470
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Software Developer

    Informations forums :
    Inscription : Mars 2008
    Messages : 1 470
    Par défaut Création menu style Oracle.com
    Bonjour,

    Je souhaiterais réaliser des menus du mêùe style que Oracle : http://www.oracle.com/technetwork/ja...ads/index.html

    Je le trouve très simple d'utilisation, très performant et très jolie.

    Quelqu'un aurait des idées pour m'éclairer ?

    Merci d'avance.

  2. #2
    Membre éclairé
    Inscrit en
    Septembre 2004
    Messages
    450
    Détails du profil
    Informations forums :
    Inscription : Septembre 2004
    Messages : 450
    Par défaut
    Citation Envoyé par alex_vino Voir le message
    Bonjour,

    Je souhaiterais réaliser des menus du mêùe style que Oracle : http://www.oracle.com/technetwork/ja...ads/index.html

    Je le trouve très simple d'utilisation, très performant et très jolie.

    Quelqu'un aurait des idées pour m'éclairer ?

    Merci d'avance.
    Tu devrais pouvoir trouver des exemple et t'en inspirer sur :
    http://www.cssplay.co.uk/menus/

  3. #3
    Membre extrêmement actif

    Homme Profil pro
    Software Developer
    Inscrit en
    Mars 2008
    Messages
    1 470
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Software Developer

    Informations forums :
    Inscription : Mars 2008
    Messages : 1 470
    Par défaut
    Super examples, mais on ne peut pas les télécharger ni même regarder le code ?

  4. #4
    Rédacteur

    Homme Profil pro
    Responsable de projet
    Inscrit en
    Mai 2009
    Messages
    634
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France

    Informations professionnelles :
    Activité : Responsable de projet
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2009
    Messages : 634
    Par défaut
    si tu scrolles légèrement la page, tu verras le code CSS et XHTML

  5. #5
    Membre éprouvé Avatar de lodan
    Profil pro
    Inscrit en
    Juin 2006
    Messages
    2 064
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2006
    Messages : 2 064
    Par défaut
    C'est comme sur La Redoute et cela porte un nom ?

  6. #6
    Membre extrêmement actif

    Homme Profil pro
    Software Developer
    Inscrit en
    Mars 2008
    Messages
    1 470
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Software Developer

    Informations forums :
    Inscription : Mars 2008
    Messages : 1 470
    Par défaut
    Citation Envoyé par ornitho13 Voir le message
    si tu scrolles légèrement la page, tu verras le code CSS et XHTML
    Bon je dois vraiment être trop bête mais je ne vois pas (et pourtant je connais la redoute )

    Par exemple dis moi comment obtenir le code de celà : http://www.cssplay.co.uk/menus/css3-backslide.html ??


  7. #7
    Membre éprouvé Avatar de lodan
    Profil pro
    Inscrit en
    Juin 2006
    Messages
    2 064
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2006
    Messages : 2 064
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    <ul id="menu">
    <li><a href="#url"><b></b>Home</a></li>
    <li><a href="#url"><b></b>Products</a></li>
    <li><a href="#url"><b></b>Services</a></li>
    <li><a href="#url"><b></b>Privacy</a></li>
    <li><a href="#url"><b></b>Contact Us</a></li>
    <li><a href="#url"><b></b>Site Map</a></li>
    </ul>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    <style type="text/css">
    #menu {padding:0; margin:0 0 50px 10px; list-style:none; height:50px;}
    #menu li {float:left;}
    #menu li a {
    display:block; 
    border: 1px solid #a99;
    height:50px; line-height:50px;
    text-decoration: none;
    font-size:12px;
    font-family:verdana, arial, sans-serif;
    padding:0 30px;
    color:black;
    overflow:hidden;
    position:relative;
    z-index:10;
    margin-right:-1px;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    }
    #menu li a b {
    display:block; 
    height:100px; 
    width:100%; 
    position:absolute; 
    left:0; 
    top:0; 
    background: url(back/back.gif) repeat-x left top; 
    z-index:-1;
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    }
    #menu li a:hover {color: #fff;}
    #menu li a:hover b {top:-50px;}
    </style>
    C'est ce que je trouve dans le code source, je ne vois pas comment autrement.

    Ne pas oublier l'auteur Stu Nicholls si nécessaire.

  8. #8
    Membre extrêmement actif

    Homme Profil pro
    Software Developer
    Inscrit en
    Mars 2008
    Messages
    1 470
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Software Developer

    Informations forums :
    Inscription : Mars 2008
    Messages : 1 470
    Par défaut
    Ouai galère je pensais qu'on pouvait télécharger directement.

    Merci beaucoup je vais scruter le site

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Script de création de base Oracle
    Par lon.zebu dans le forum Import/Export
    Réponses: 2
    Dernier message: 28/12/2007, 11h36
  2. [Système] Création menu dynamique
    Par delma dans le forum Langage
    Réponses: 1
    Dernier message: 20/10/2006, 19h44
  3. Réponses: 7
    Dernier message: 10/07/2006, 14h54
  4. [C#] Création menu sur fenêtre form
    Par Tips dans le forum Windows Forms
    Réponses: 4
    Dernier message: 10/11/2005, 21h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo