Personnalisation de la flèche select form
Bonjour,
J'utilise un script pré construit qui me comble presque parfaitement. L'idée étant de personnaliser la flèche select d'un formulaire.
A la base mon texte est gris clair, et j'aimerais qu'il devienne noir dés que la sélection est faite. Malheureusement, ce script cache le vrai champ select de formulaire et montre un span par dessus.
Voici le script Javascript:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| <script type="text/javascript">
$(document).ready(function(){
if (!$.browser.opera) {
$('select.select').each(function(){
var title = $(this).attr('title');
if( $('option:selected', this).val() != '' ) title = $('option:selected',this).text();
$(this)
.css({'z-index':10,'opacity':0,'-khtml-appearance':'none'})
.after('<span class="select">' + title + '</span>')
.change(function(){
val = $('option:selected',this).text();
$(this).next().text(val);
})
});
};
});
</script> |
Dans ma page j'écris quasiment de façon classique le champ de formulaire:
Code:
1
2
3
4
5
6
7
8
| <div style="position:relative; margin-bottom:10px">
<select name="titre" id="titre" class="select">
<option value="0" <?php if($id_utilisateur == 0){ ?>selected="selected"<?php } ?>>Titre</option>
<option value="1 ">Mr</option>
<option value="2">Madame</option>
<option value="3">Mademoiselle</option>
</select>
</div> |
Voici un apercu de ce que ca donne:
Etape1:
http://img163.imageshack.us/img163/2...lectperso1.jpg
Etape2:
http://img714.imageshack.us/img714/3...lectperso2.jpg
Etape3:
http://img513.imageshack.us/img513/862/selectperso3.jpg
Comment puis-je changer la couleur Police de Mademoiselle en noir ?
Merci
