Kursor: nieruchomość wskaźnik nie stosuje się do przesyłania plików przycisków w przeglądarkach WebKit

Question

mam kod CSS, który tak naprawdę nie działa w przeglądarkach WebKit, takich jak Safari i Chrome

jeśli chcesz żyć przykład tutaj jest http://jsfiddle.net/mnjKX/1/

mam ten kod CSS

.file-wrapper { 
    cursor: pointer; 
    display: inline-block; 
    overflow: hidden; 
    position: relative; 
} 
.file-wrapper input { 
    cursor: pointer; 
    font-size: 100px; 
    height: 100%; 
    filter: alpha(opacity=1); 
    -moz-opacity: 0.01; 
    opacity: 0.01; 
    position: absolute; 
    right: 0; 
    top: 0; 
} 
.file-wrapper .button { 
    background: #79130e; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 
    color: #fff; 
    cursor: pointer; 
    display: inline-block; 
    font-size: 11px; 
    font-weight: bold; 
    margin-right: 5px; 
    padding: 4px 18px; 
    text-transform: uppercase; 
} 

i ten kod HTML:

<span class="file-wrapper"> 
    <input type="file" name="photo" id="photo" /> 
    <span class="button">Choose a Photo</span> 
</span> 

ten kod pokazuje ukrytą etykietę pliku wejściowego, Problem polega na tym, że kursor: wskaźnik nie działa w przeglądarkach Webkit,

jak mogę go rozwiązać lub obejść/wyprzedzić?

Answer 1

Po pierwsze, działa w Chrome, jeśli usuniesz deklarację height z reguły .

żywo demo:http://jsfiddle.net/mnjKX/16/

Ale to pole wejściowe przezroczysty jest piekło hack ... nie będę na nim polegać.

---

Aktualizacja:

I tu jest właściwe rozwiązanie:

::-webkit-file-upload-button { cursor:pointer; } 

Myślałem przycisk Prześlij plik jest nieosiągalny, ale arkusz stylów kliencka Chrome okazały mojego złego :)

Answer 2

Interesujące (przeglądarka) rozwiązanie, które wymyśliłem:

Wprowadź wartość właściwości CSS kursora: wskaźnik, umieść wejście w div (z przepełnieniem: ukryte) i podaj lewy margines 100%. Wyściełany obszar będzie miał właściwość wskaźnika.

Osobiście nie mam zaufania - ustawienia webkamtu i -moz, ponieważ mam wrażenie, że są arbitralne i tymczasowe, i wkrótce zostaną zastąpione.