Question simple ... Comment changer le type de curseur sur un type de fichier?
J'ai essayé ce qui suit:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style>
input[type="file"] {
cursor: pointer;
}
</style>
</head>
<body>
<input type="file">
</body>
</html>
Pour une raison quelconque, il ne jouera pas la balle.
Il fonctionne différemment dans les différents navigateurs. Je suppose que c'est parce que le fichier d'entrée est de type tout à fait spécial.
Quel navigateur/version utilisez-vous?
Je sais que IE6 ne supporte pas de spécifier le type dans le style.
Fonctionne parfaitement.
Problème est résolu, alors maintenant il fonctionne parfaitement. Voir le rapport de bug sur cette question.
Dans la version 3.5, il n'a pas de travail du tout.
Utilise la flèche sur le bouton, mais votre curseur sur le reste.
Fonctionne parfaitement.
Notez qu'il existe plusieurs solutions de contournement à l'aide de différentes techniques qui vont venir autour de ce problème. La réponse par BjarkeCK est une solution élégante, j'aime, et il fonctionne sur tous les principaux navigateurs.
J'ai fait une solution avec jquery ici: http://jsfiddle.net/gKVKm/36/
Jetez un oeil ici pour voir ce qui se passe:
Il fonctionne pour moi dans Opera, Safari, IE, Chrome et Firefox.
cursor:pointer ne fonctionne pas sur le fichier d'entrée juste à cause du bouton par défaut. Pas de raison particulière ici. Vous devez retirer son apparition par le biais de ce code, attention avec font-size:0.
<input type="file">
input[type='file']{
opacity: 0;
cursor: pointer;
font-size: 0;
}
Il fonctionne perpectly sur Chrome, Firefox et IE.
Démo ici http://jsfiddle.net/FCpsv/.
Connaissez-ce un vieux thread. Mais les résultats de google apporte cette place... je Viens de trouver une solution partielle à google chrome (pas invalving flash, javascript, supplémentaires de manipulation du DOM avec trop-plein caché)
.
input[type=file], /* FF, IE7+, chrome (except button) */
input[type=file]::webkit-file-upload-button { /* chromes button */
cursor: pointer;
}
Le problème est que le bouton n'a pas hérité de la propriété cursor en général(?) mais le reste de l'input[type=file] champ de la dose. C'est pourquoi chrome obtenir le pointeur à l'exception du bouton
Si vous souhaitez forcer le curseur à la main afin de le mettre sur une image, voici un
HTML:
<img src="/images/uploadButton.png" id="upfile1" style="cursor:pointer" />
<input type="file" id="file1" name="file1" style="display:none" />
JQuery:
$("#upfile1").click(function () {
$("#file1").trigger('click');
});
Ensuite, vous pouvez appuyer sur n'importe quel bouton pour télécharger le fichier, et vous avez un pointeur curseur .
Dans Chrome et Opera le curseur devient un pointeur sur le rembourrage et seulement si display:block; , c'est pourquoi pour ces navigateurs, vous devriez faire ceci:
<input type="file" id="file1" name="file1" style="display:block; padding:29px 0 0 0;" />
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
