Avoir le même effet bleuté sur les liens

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Avoir le même effet bleuté sur les liens

Message par -Méphisto- le Dim 28 Avr 2013 - 21:49

Bonjour, j'adore le passage à la couleur halo bleuté des liens de ce forum quand on passe le curseur dessus.(pas en mode réponse rapide, mais en cliquant sur "répondre")

En cherchant, j'ai vu qu'il existait un tuto pour changer les couleurs des liens, mais ça me semble un peu compliqué, surtout s'il faut tâtonner afin d'obtenir la même nuance qu'ici.

http://forum.forumactif.com/t345726-ajouter-un-effet-de-transition-sur-les-liens

S'il est possible d'obtenir exactement le même code qu'ici, ça me ferait bien plaisir. Smile
Sinon pas de souci, je tâtonnerai avec les codes si je trouve le temps, vous êtes déjà si impliqués et prévenants sur des tas de sujets plus importants Wink

Merci quoi qu'il en soit Smile


Dernière édition par -Méphisto- le Lun 29 Avr 2013 - 20:51, édité 2 fois

-Méphisto-
# Tropactif #

Messages : 1654
Inscrit(e) le : 31/08/2007

http://cafet.1fr1.net/
-Méphisto- a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avoir le même effet bleuté sur les liens

Message par Milouze14 le Lun 29 Avr 2013 - 6:12

Salut -Méphisto- Clin d\'oeil ,
pour les couleurs de liens sur le F.D.F :

Code:

/*LIEN NORMAL*/
a:link
{
color: #0372BE;
text-decoration: none;
}
/*LIEN SURVOLE*/
a:hover
{
color:#FF8A00;
}

On peut toujours personnaliser autrement des liens en plaçant dans un template
un identifiant :
Exemple avec le template INDEX_BODY

Tout au début on place par exemple un identifiant facilement repérable dans la C.S.S:

Code:

<div id="M14_lien_INDEX_body">


Puis à la fin de ce dernier la fermeture:
Code:
</div>

et enfin dans la css
l’identifiant puis ensuite la class
Code:

#M14_lien_INDEX_body .gensmall {color:red;}
#M14_lien_INDEX_body a.gensmall {color:green;}
#M14_lien_INDEX_body a.forumlink {color:darkblue;}
#M14_lien_INDEX_body a.cattitle {color:darkorange;}
#M14_lien_INDEX_body .mod-text {color:black;}
#M14_lien_INDEX_body a.group-mod {color:violet;}
#M14_lien_INDEX_body a:link{color:darkred;}

Voilà, c'est juste à titre d'exemple Wink .

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4561
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par -Méphisto- le Lun 29 Avr 2013 - 10:15

Merci, j'ai essayé, mais à les liens ne sont pas devenus bleutés au passage du curseur ... Embarassed

En revanche, des pseudos le sont devenus et d'autres nons, ainsi que des titres (et d'autres non) et des numéros de pages de topics (et d'autres non)

Ex :



Shocked

-Méphisto-
# Tropactif #

Messages : 1654
Inscrit(e) le : 31/08/2007

http://cafet.1fr1.net/
-Méphisto- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par Milouze14 le Lun 29 Avr 2013 - 18:03

Re,
j'ai essayé, mais à les liens ne sont pas devenus bleutés au passage du curseur ...

Si tu parles des boutons "Prévisualiser" "Brouillon" et "Envoyer" ?

Essayes ceci, tu devrais retrouver un peu le même style Clin d\'oeil :


Si tu as déjà personnalisé ces derniers dans ta C.S.S, penses à les supprimer avant Wink .

Code:

/*Les boutons previsualiser brouillon et envoyer etc*/
input.mainoption , input.liteoption
{
    background-color: #F5F5F5;
    background-image: url("http://i83.servimg.com/u/f83/18/26/42/15/bouton10.png");
    background-repeat: repeat-x;
    border: 1px solid #C3E0F1;
    border-radius: 2px 2px 2px 2px;
    box-shadow: 1px 1px 1px;
    color: #666666 !important;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    height: 24px;
    line-height: 27px;
    margin: 5px 6px;
    padding: 0 8px !important;
    text-align: center;
  -o-transition-timing-function: ease-in;
-webkit-transition: all 0.5s ease-in;
-moz-transition: all 0.5s ease-in;
-o-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
}
/*Les boutons previsualiser brouillon et envoyer etc au survol*/
input.mainoption:hover , input.liteoption:hover
{
    background-position: 0px 100%;
    border: 1px solid #00A5CD !important;
    box-shadow: 1px 1px 5px !important;
    color: #00A5CD !important;
}
Pense à valider les modifications en cliquant sur le bouton "Valider".
a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4561
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par -Méphisto- le Lun 29 Avr 2013 - 19:22

Merci, mais ce que je recherche, c'est d'avoir les boutons "gras", "police" "smiley" qui se retrouvent soudain dans un encadré qui devient arrondi (au lieu d'être carré) et nimbé de bleu même à l'extérieur du cadre au passage du curseur Wink

Et je me suis aperçu que sur IE, tout rame (le bouton répondre ne s'affiche qu'au bout d'une minute ou plus!) et une fois la fenêtre enfin ouverte, bien des images liens ne s'affichent plus (ou par des carré avec une croix rouge) (je ne sais si c'est lié, mais la coïncidence est troublante)



Embarassed

-Méphisto-
# Tropactif #

Messages : 1654
Inscrit(e) le : 31/08/2007

http://cafet.1fr1.net/
-Méphisto- a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par Milouze14 le Lun 29 Avr 2013 - 19:47

Re,
si c'est comme sur le module de rédaction ce sera ce code:

Code:
button.button2:hover , input.button2:hover
{
    background-position: 0px 100%;
    border: 1px solid #00A5CD !important;
    box-shadow: 1px 1px 5px !important;
    color: #00A5CD !important;
    text-decoration:none !important;
}


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4561
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par -Méphisto- le Lun 29 Avr 2013 - 19:55

Ah, là c'est génial !!! Very Happy

Merci Milouze !

Juste un détail esthétique. Y a -t-il moyen d'avoir quelque part le même cadre qu'ici en réponse rapide. Le cadre bleuté est tout arrondi, c'est très doux je trouve. Mais est-ce possible en version "répondre" normale ?

-Méphisto-
# Tropactif #

Messages : 1654
Inscrit(e) le : 31/08/2007

http://cafet.1fr1.net/
-Méphisto- a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avoir le même effet bleuté sur les liens

Message par Milouze14 le Lun 29 Avr 2013 - 20:03

Re,
supprimes la class et remplaces par:

Code:

button.button2:hover , input.button2:hover
{
    background-position: 0px 100%;
    border: 1px solid #00A5CD !important;
    box-shadow: 1px 1px 5px !important;
    color: #00A5CD !important;
    text-decoration:none !important;
  -webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4561
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir le même effet bleuté sur les liens

Message par -Méphisto- le Lun 29 Avr 2013 - 20:51

Merci Milouze, c'est très réussi !!!! thumright

-Méphisto-
# Tropactif #

Messages : 1654
Inscrit(e) le : 31/08/2007

http://cafet.1fr1.net/
-Méphisto- a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum