2012-11-21 9 views
5

Po dodaniu pliku jqm-icon-pack-2.1.2-fa.css do mojej witryny, czcionki jQuery UI nie są wyświetlane. Jeśli usuniemy odniesienie, pokażą. Tworzę aplikację mobilną MVC4 przy użyciu Visual Studio 2012. Oto jak ja przedstawieniu pliki CSS:Konflikt ikon świetnych czcionek z ikonami jQuery UI

<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile.structure-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile.theme-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jqm-icon-pack-2.1.2-fa.css")" type="text/css"> 

Jeśli usunąć ostatnią odniesienia, ikony jQuery działają ale czcionka Niesamowite ikony nie praca. Próbowałem zmienić kolejność referencji i to się nie udawało. Sprawdziłem stronę za pomocą Firebuga i nie widzę różnicy. Upewniłem się, że ścieżki są poprawne. Chciałbym zamieścić link do mojej strony, ale jest w extranecie, więc nie można uzyskać do niego dostępu. Najlepsze, co mogę zaoferować, to ustawienie danych wejściowych dla type = "search", a ikona wyszukiwania i ikona czystego tekstu nie są wyświetlane. Każda pomoc będzie bardzo ceniona!

ODPOWIEDŹ: Rozwiązałem problem i mam nadzieję, że uda się uratować innym trochę żalu i godzin bicia ich głów na klawiaturze, tak jak ja! Kiedy używasz NuGet Package Manager do pobrania jQuery mobile, dodaje kilka plików obrazów o nazwach icons-18-black.png, icons-18-white.png, icons-36-black.png i icons-36-white.png. Jeśli nie jesteś ostrożny, możesz pominąć fakt, że na stronie github znajdują się nieco inne pliki graficzne, które musisz dołączyć do Font Awesome o nazwie icons-18-black-pack.png, icons-18-white-pack.png , icons-36-black-pack.png i icons-36-white-pack.png. Zauważ, że słowo "pack" jest zawarte w nazwie tych plików i są one nieco inne niż oryginalne pliki dołączone do jQuery mobile. Tylko pamiętaj, aby dodać brakujące pliki oraz plik ajax-loader.png, który jest inny niż plik ajax-loader.gif dołączony do jQuery mobile i wszystkie powinny działać.

+1

Powinieneś edytować odpowiedź na swoje pytanie i opublikować ją jako faktyczną odpowiedź na swoje pytanie i oznaczyć ją jako zaakceptowaną. W ten sposób, gdy ludzie zobaczą twoje pytanie, mogą zobaczyć, że istnieje skuteczne rozwiązanie. – Jack

+0

Przepraszam, musiałem czekać, zanim będę mógł opublikować odpowiedź na moje własne pytanie. Nie wiem, dlaczego tak się stało, ale być może dlatego, że wysłałem odpowiedź. Dzięki! – Darrell

Odpowiedz

3

Rozwiązałem problem i mam nadzieję, że uda się uratować innym trochę żalu i godzin bicia ich głowami na klawiaturze, tak jak ja! Kiedy używasz NuGet Package Manager do pobrania jQuery mobile, dodaje kilka plików obrazów o nazwach icons-18-black.png, icons-18-white.png, icons-36-black.png i icons-36-white.png. Jeśli nie jesteś ostrożny, możesz pominąć fakt, że na stronie github znajdują się nieco inne pliki graficzne, które musisz dołączyć do Font Awesome o nazwie icons-18-black-pack.png, icons-18-white-pack.png , icons-36-black-pack.png i icons-36-white-pack.png. Zauważ, że słowo "pack" jest zawarte w nazwie tych plików i są one nieco inne niż oryginalne pliki dołączone do jQuery mobile. Tylko pamiętaj, aby dodać brakujące pliki oraz plik ajax-loader.png, który jest inny niż plik ajax-loader.gif dołączony do jQuery mobile i wszystkie powinny działać.