[RESOLU] Travail sur la PA de mon fow (Soucis image) Bouton_active[RESOLU] Travail sur la PA de mon fow (Soucis image) Bouton_hover[RESOLU] Travail sur la PA de mon fow (Soucis image) Fb-hover[RESOLU] Travail sur la PA de mon fow (Soucis image) Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
[RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 11 Fév 2023, 06:04 par Krager

Le deal à ne pas rater :
Sortie PlayStation 5 Pro : où précommander la console PS5 Pro ?
Voir le deal

Partagez
 

[RESOLU] Travail sur la PA de mon fow (Soucis image)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Bonsoir tout le monde,

Je viens chercher de l'aide auprès de vous, car je suis en train de commencer à coder ma PA. J'en suis qu'au premier élément, mais j'suis déjà très fière. [RESOLU] Travail sur la PA de mon fow (Soucis image) 2176505670
J'ai deux petites questions... Ou pour la deuxième, plutôt grande.

1. J'arrive pas à mettre un contour à une image sur ma PA. J'ai mis ça dans mon CSS:

Code:
#avatarakyacontour {
-moz-border-radius-bottomleft:10px; /*CADRE AUTOUR DE L'AVATAR PA*/
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid #FFFFFF;
}

Pourquoi ça fonctionne pas? [RESOLU] Travail sur la PA de mon fow (Soucis image) 4257895609

2. Je voulais savoir si il était possible de faire une sorte de tiroir sous l'image, où, en passant la souris sur une "languette", le tiroir se déroulerait vers le bas, dévoilant des informations. Et si oui, où suis-je censée pouvoir trouver un tutoriel?

Je suis actuellement sur le codage de la partie Staff, pour l'instant. Wink

Merci infiniment pour vos prochaines réponses. <33


Dernière édition par Akya le Sam 12 Mai 2012, 05:23, édité 1 fois
MessageSujet: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 14:55
Revenir en haut Aller en bas
Hiro
Hiro
Ninja Codeur
Ninja Codeur

Masculin Messages : 1179



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Salut, pour le 1, ton code n'est fonctionnel qu'avec Mozilla Firefox; essaie plutôt celui-ci :

Code:

#avatarakyacontour {
   /*CADRE AUTOUR DE L'AVATAR PA*/
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
   border-radius: 10px;
   border: 5px solid #FFFFFF;
}

Et 2, oui c'est possible.

Peut tu passer un lien vers la page ou se trouve ta PA ? Wink
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 15:47
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Ca ne fonctionne pas... :/ Peut être parce qu'autour de l'image y'a une autre div? Il s'agit de celle ci:

Code:
#avatarAkya {
position: absolute;
top: 570px;
left: 955px;}

C'est pour que je puisse placer l'image où je veux sur la PA. Mais je comprends pas pourquoi ton code fonctionne pas. J'm'acharne dessus depuis déjà quinze minutes. x_X

Oui voilà le lien: http://dreamcatgraph.conceptforum.net/

Merci en tout cas. Smile
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 16:00
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Je te conseille même de mettre ceci:

Code:
#avatarakyacontour {
  /*CADRE AUTOUR DE L'AVATAR PA*/
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      -o-border-radius:10px;
  border-radius: 10px;
  border: 5px solid #FFFFFF;
}

Pour tous les utilisateurs d'opera Wink
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 16:00
Revenir en haut Aller en bas
Hiro
Hiro
Ninja Codeur
Ninja Codeur

Masculin Messages : 1179



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Donc,

Ajoute le code de Nyo comme ceci :

Code:

#avatarAkya img {
  /*CADRE AUTOUR DE L'AVATAR PA*/
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      -o-border-radius:10px;
  border-radius: 10px;
  border: 5px solid #FFFFFF;
}


Cela devrait fonctionner Smile
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 16:02
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Bingo ça marche. I love you On aura un peu galéjer quand même. Very Happy
Et donc, tu me disais que pour le 2, c'est possible? Avec un panneau latéral coulissant peut être?
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyDim 06 Mai 2012, 16:07
Revenir en haut Aller en bas
http://www.css-actif.com/
Luffy ♣
Luffy ♣
King of Pirates

Masculin Messages : 4694



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Ciaossu,
Ton problème (du moins le n°2 XD) est-il toujours d'actualité ?
Si oui, il faudrait le préciser afin que les codeurs puissent voir ton problème et tenter de t'aider à le résoudre =D
D'avance, merci [RESOLU] Travail sur la PA de mon fow (Soucis image) 1440637669
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyVen 11 Mai 2012, 01:50
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Dans le règlement les ups ne sont pas autorisés, alors je ne me suis pas permis d'uper. ^^"
Mais oui, mon soucis est toujours d'actualité. Smile


Dernière édition par Akya le Sam 12 Mai 2012, 03:31, édité 1 fois
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyVen 11 Mai 2012, 11:16
Revenir en haut Aller en bas
Psycho
Psycho
Psychopathe
Psychopathe

Féminin Messages : 3407



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Hello Akya !
Tu as raison, les "up" ne sont pas autorisés sur l'ensemble du forum, tu as bien fait de ne pas poster (:
Ce que voulait dire Luffy, c'était de re-préciser à nouveau quel était ton problème afin que les codeurs puissent le comprendre direct et peut être t'aider (:
Merci d'avance [RESOLU] Travail sur la PA de mon fow (Soucis image) 926145
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptyVen 11 Mai 2012, 17:20
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Ah! Je ré-explique donc. Smile Merci.

Je cherche à faire au final un panneau latéral coulissant vers le bas, qui serait positionné juste sous une image 100*100. La première partie de la question était de savoir si c'était possible, et la deuxième partie est, comment? Je dispose d'un code trouver sur le FDF, mais il coulisse soit vers la droite, soit vers la gauche...

Merci d'avance. Wink
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 03:31
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Je suis pas sûre de comprendre! ^^"

Est-ce que tu voudrais quelque chose comme ici: (je parle de tout en bas de la page, le panneau "Navigation, qui s'ouvre et se ferme au passage de la souris).
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:06
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Oui, c'est tout à fait ça, mais la largeur ferait 100 px. Smile
Suis-je autorisée à mettre le lien de mon forum pour que tu comprennes mieux où sera placé le panneau coulissant?
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:08
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Absolumnent Wink

Et quand tu dis "ferait une largeur de 100px" ce serait tout le panneau, ou juste le bout avec écrit dessus "navigation" ? ^^
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:10
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty


Vois-tu l'image sur la PA, tout à droite? Le panneau serait juste en dessous.
La largeur serait en effet pour tout le panneau. Smile
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:11
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
D'accord, je vois! ^^
Alors je vais te donner le code que j'ai utilisé sur le forum que je t'ai montré précédemment,en enlevant les autres valeurs. Cependant, fais attention, ma position est absolute, tu devras faire beaucoup de mise en point (avec les margin) pour avoir le panneau à la bonne place! ^^ Ça prend du temps, mais y'a pas de remède miracle: j'ai fait pareil! ^^

Voici ce qu'il faut mettre dans le HTML:
Code:
<div class="nav_and_pagination">
                    <span class="nav_pag">CE_QUE_TU_VEUX_DANS_TON_TABLEAU</span>
  <span class="ouverture_nav_pag">INSCRYPTION_POUR_L'OUVERTURE</span></div>

Et voici le CSS. Attention, c'est long! =P
Code:
/*Début du panneau ouvrant*/
.nav_pag {
 /*Ici tu positionnes le contenu du tableau. Remplace les XX dans les margin par ce que tu veux! ^^*/
    position: absolute;
  margin-left: XXpx;
  margin-top: XXpx;
 /*Transition, pour qu'à la fermeture ET l'ouverture, le tout s'ouvre/ferme lentement. Il va falloir mettre ce code fréquemment!*/
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
 /*Ici tu donnes toutes les valuers nécessaires. Ce sont des exemples, tu peux donner plus! ^^*/
    background: ICI_LES_DONNÉES_DU_FOND;
    color: COULEUR_DE_L'ÉCRITURE;
    display: block;
 /*Ces lignes sont à garder! C'est ce qui fait que ton panneau ne s'affiche pas! ^^*/
    height: 0px;
    width: 100px;
    overflow: hidden;
    z-index: 3;
}
.ouverture_nav_pag {
 /*Là tu positionnes l'ouverture! Elle est à positionner plus bas que ton tableau. Sa position changera au hover, mais ça se passe plus bas!*/
    position: absolute;
  margin-left: XXpx;
  margin-top: XX5px;
 /*L'ouverture ne doit pas changer soudainement de position, mais lentement!*/
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
 /*Les données que tu veux, pour la mise en forme de l'ouverture!*/
    background: DONNÉES;
    border-radius: ICI_TU_FAIS_TES_BORDS_ARRONDIS;
    -moz-border-radius: ICI_TU_FAIS_TES_BORDS_ARRONDIS;
    -o-border-radius: ICI_TU_FAIS_TES_BORDS_ARRONDIS;
    -webkit-border-radius: ICI_TU_FAIS_TES_BORDS_ARRONDIS;
    color: #B5B5B5;
    font-size: XXpx;
 /*Largeur et hauteur de l'ouverture. Tu peux la rendre plus petite si nécessaire! Le reste est à garder!*/
    height: 20px;
    width: 100px;
    display: block;
    float: right;
    z-index: 3;
}
.nav_and_pagination:hover .nav_pag {
/*Transitions, encore et toujours des transitions @_@!*/
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
/*Nous sommes dans ton panneau, une fois ouvert. Donc, tu peux mettre u peu les donées que tu veux. tu peux remplacr le overflow: hidden par un scroll, par exemple, mais le height et les width doivent avoir une valeur plus grande que 0!!*/
    background: DONNÉES;
    overflow: hidden;
    color: COULEUR_TEXTE;
    height: 100px;
    width:100px;
    padding: XXpx;
}

.nav_and_pagination:hover .ouverture_nav_pag {
/*La margin supérieure doit changer ici, car à l'ouverture, tu veux que ton texte d'ouverture coulisse avec le reste de ton panneau!!*/
    position: absolute;
  margin-top: 100px;
/*Et transition >< */
    -moz-transition: all 1s ease 0s;
    transition: all 1s ease 0s;
    -webkit-transition: all 1s ease 0s;
    -o-transition: all 1s ease 0s;
}
/*Fin du panneau ouvrant*/

Voilà!
Si tu as encore des question, n'hésite pas, et si ton problème est résolu, tu peux l'indiquer à la suite et le mettre dans le titre de ton sujet (je te conseille de le faire après avoir mit en place ton panneau! =P)
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:38
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Juste, je m'en sors très bien, mais pour positionner entièrement le tableau, et pas que le contenu, je fais comment?
Merci beaucoup en tout cas. Smile
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:51
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Le code que je t'ai donné positionne tout le tableau ^^"
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:55
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Ben j'ai fais ouais, mais après quand je passe ma souris pour l'ouvrir l'ouverture bug. :S
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 04:56
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Je l'ai mit dans le code: tu dois changer le margin de l'ouverture selon la hauteur de ton bloc. Donc, l'ouverture doit avoir un margin-top de la hauteur de ton bloc+quelques pixels!
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 05:10
Revenir en haut Aller en bas
http://milky-dream.web-rpg.org/forum.htm
Akya
Akya
{ Membre }
{ Membre }

Féminin Messages : 207



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Ok c'est tout bon!!! ENFIN!! Ca a été une belle galère, mais ça en valait la peine. ^_^ Merci infiniment. Sujet résolu.
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 05:23
Revenir en haut Aller en bas
http://lower-theory.teamconvention.com/index.htm
Nyo The Neko
Nyo The Neko
{ Spécialiste }
{ Spécialiste }

Féminin Messages : 245



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Le gros problèmes des positionnement c'est ça: on galère à avoir ce qu'on veut! =P

De rien! ^^
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 05:27
Revenir en haut Aller en bas
http://www.css-actif.com/
Luffy ♣
Luffy ♣
King of Pirates

Masculin Messages : 4694



[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Dans ce cas, je classe Wink

Merci à toi Nyo d'avoir aidé =D
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) EmptySam 12 Mai 2012, 06:10
Revenir en haut Aller en bas
Contenu sponsorisé




[RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
MessageSujet: Re: [RESOLU] Travail sur la PA de mon fow (Soucis image)   [RESOLU] Travail sur la PA de mon fow (Soucis image) Empty
Revenir en haut Aller en bas
 

[RESOLU] Travail sur la PA de mon fow (Soucis image)

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Soucis image dans Categorie
» soucis de bordures [RESOLU]
» Soucis de codage [résolu]
» Soucis de largeur [Résolu]
» [RESOLU] Soucis de slideshow

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forumactif.com