2013-06-13 4 views
1

Andy Matthew의 사용자 정의 jQuery Mobile 아이콘 팩 ("원본"및 "글꼴 굉장한"아이콘)을 사용하고 있습니다. 멋진 글꼴은 iPad에서 작동하지만 "원본" 아이콘 표시 (그러나 삼성 기기 등에 표시)하지 않는jQuery 모바일 아이콘이 Ipad 3에 표시되지 않습니다.

다음과 같이 내가 레일 자산 파이프 라인과 함께 작업 할 수있는 CSS를 수정 :..

/* 
    jQuery Mobile Icon Pack 
    andy matthews 
    @commadelimited 
*/ 

/* Icons 
-----------------------------------------------------------------------------------------------------------*/ 

.ui-icon, 
.ui-icon-searchfield:after { 
    background: #666666; 
    background: rgba(0,0,0,.4); 
    background-image: image-url('vendor/jqm-icon-pack/icons-18-white-pack.png'); 
    background-repeat: no-repeat; 
    -moz-border-radius: 9px; 
    -webkit-border-radius: 9px; 
    border-radius: 9px; 
} 


/* Alt icon color 
-----------------------------------------------------------------------------------------------------------*/ 

.ui-icon-alt { 
    background: #ffffff; 
    background: rgba(255,255,255,.3); 
    background-image: image-url('vendor/jqm-icon-pack/icons-18-black-pack.png'); 
    background-repeat: no-repeat; 
} 

/* restore default loading image */ 
.ui-icon-loading { 
    background: image-url('vendor/jqm-icon-pack/ajax-loader.gif'); 
    background-size: 46px 46px; 
} 

/* HD/"retina" sprite 
-----------------------------------------------------------------------------------------------------------*/ 

@media only screen and (-webkit-min-device-pixel-ratio: 1.3), 
     only screen and (-o-min-device-pixel-ratio: 3/2), 
     only screen and (min--moz-device-pixel-ratio: 1.3), 
     only screen and (min-device-pixel-ratio: 1.3), 
     only screen and (min-resolution: 1.3dppx) { 

    .ui-icon-plus, .ui-icon-minus, .ui-icon-delete, .ui-icon-arrow-r, 
    .ui-icon-arrow-l, .ui-icon-arrow-u, .ui-icon-arrow-d, .ui-icon-check, 
    .ui-icon-gear, .ui-icon-refresh, .ui-icon-forward, .ui-icon-back, 
    .ui-icon-grid, .ui-icon-star, .ui-icon-alert, .ui-icon-info, .ui-icon-home, .ui-icon-search, .ui-icon-searchfield:after, 
    .ui-icon-checkbox-off, .ui-icon-checkbox-on, .ui-icon-radio-off, .ui-icon-radio-on, .ui-icon-email , .ui-icon-page, 
    .ui-icon-question , .ui-icon-foursquare , .ui-icon-twitter , .ui-icon-facebook , .ui-icon-dollar , .ui-icon-euro, 
    .ui-icon-pound , .ui-icon-apple , .ui-icon-chat , .ui-icon-trash , .ui-icon-bell , .ui-icon-mappin , .ui-icon-direction, 
    .ui-icon-heart , .ui-icon-wrench , .ui-icon-play , .ui-icon-pause , .ui-icon-stop , .ui-icon-person , .ui-icon-music, 
    .ui-icon-rss , .ui-icon-wifi , .ui-icon-phone , .ui-icon-power , .ui-icon-lock , .ui-icon-flag , .ui-icon-calendar, 
    .ui-icon-lightning , .ui-icon-drink , .ui-icon-android , .ui-icon-edit { 
     background-image: image-url('vendor/jqm-icon-pack/icons-36-white-pack.png'); 
     -moz-background-size: 774px 54px; 
     -o-background-size: 774px 54px; 
     -webkit-background-size: 774px 54px; 
     background-size: 774px 54px; 
    } 
    .ui-icon-alt { 
     background-image: image-url('vendor/jqm-icon-pack/icons-36-black-pack.png'); 
    } 
} 

이 내가 변경하지 않은 이외의를 images 디렉토리는 다음과 같습니다. assets/images/vendor/jqm-icon-pack

+0

이것을 확인하십시오 http://stackoverflow.com/questions/16453714/why-arent-jquery-mobile-icons-clipped - 고해상도 디바이스에 적합 – Omar

답변

0

Jquery Mobile ser 최대 망막 망막 최적화 아이콘,하지만 당시 망막 친화적 인 아이콘을 표시하기위한 논리에 버그가있었습니다

관련 문제