Option rechercher

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

Résolu Option rechercher

Message par MAC le Sam 24 Mar 2012 - 17:08

Bonjour,

Je souhaite installer le même type de qualité graphique que forumactif du rechercher, pouvez vous me communiquer le script.

Merci


Dernière édition par MAC le Mar 27 Mar 2012 - 8:57, édité 1 fois

MAC
*****

Messages : 736
Inscrit(e) le : 03/12/2005

MAC a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par Dr. Karlos le Sam 24 Mar 2012 - 21:30

Bonsoir,

Nous ne donnons pas de codes sans vous faire travailler un peu. Wink

Pouvons-nous avoir l'adresse de votre forum? De plus, quels éléments en particulier désirez-vous retrouver sur votre barre de recherche?


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

http://www.forum.forumactif.com
Dr. Karlos a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par MAC le Dim 25 Mar 2012 - 8:50

Bonjour,

Voici mon forum : http://www.letirsportif.com/forum

je consacre beaucoup de temps au forum et cela fait bientôt 7 ans que je suis chez forumactif et je suis bien evidemment tres satisfait du service, mais je n'ai aucune idée à quoi doit ressembler le script.
Je ne parle pas de la barre de navigation mais juste en dessous de celle ci la zone de recherche, que lorsque l'on clique celle ci s'élargie, dispose d'un beau bouton...
merci

MAC
*****

Messages : 736
Inscrit(e) le : 03/12/2005

MAC a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par Dr. Karlos le Dim 25 Mar 2012 - 19:58

Bonsoir,

Pour réaliser l'effet d'agrandissement de la boîte de recherche, insérez ces deux codes dans votre CSS (PA | Affichage | Images et couleurs | Couleurs | Feuille de style CSS);
Code:
#search #keywords{
-htm-transition-duration:1s;
-moz-transition-duration:1s;
-o-transition-duration:1s;
-webkit-transition-duration:1s;
transition-duration:1s;
}
Les transition-duration correspondent au nombre de secondes avant que la boîte de recherche redevienne normale. La valeur doit être la même sur l'ensemble de ceux-ci puisqu'ils permettant l'affichage de l'effet sous différents navigateurs.

Insérez ensuite ce code à la suite de l'autre:
Code:
#search #keywords:focus{
width:250px;
-htm-transition-duration:4s;
-moz-transition-duration:4s;
-o-transition-duration:4s;
-webkit-transition-duration:4s;
transition-duration:4s;}
Remplacez 250px par la grandeur de la taille lorsqu'elle est agrandie. Pour les transition-duration, il s'agit du nombre de secondes avant que la boîte atteigne la taille maximale. Wink

Pour la bouton, vous pouvez le modifier à l'aide de ce code CSS:
Code:
#search-box input.button2{
propriétés;
}

Et pour le bouton lorsque survolé:
Code:
#search-box input.button2:hover{
propriétés;
}

Le tutoriel sur le CSS devrait vous aider à la modifier, nous sommes aussi présents afin de vous aider. Wink


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

http://www.forum.forumactif.com
Dr. Karlos a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par MAC le Dim 25 Mar 2012 - 21:34

Merci beaucoup c'est super !

Par contre un dernier petit détail, comment retirer la petite loupe qui est présente dans cette zone ?

Merci

MAC
*****

Messages : 736
Inscrit(e) le : 03/12/2005

MAC a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par Dr. Karlos le Dim 25 Mar 2012 - 21:38

Re,

Il suffit d'insérer ce code à la suite des autres dans votre CSS:
Code:
input.search {
background-image: none;
}


Cordialement.


Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

http://www.forum.forumactif.com
Dr. Karlos a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Option rechercher

Message par MAC le Mar 27 Mar 2012 - 8:56

Merci beaucoup Cool

MAC
*****

Messages : 736
Inscrit(e) le : 03/12/2005

MAC 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