2015-02-05 4 views
0

jQuery .css() (v1.11) 메소드가 왜 0 %를 반환하는지 이해하는 데 도움이되기를 바랍니다. 실행 중 및 스타일 시트에서 속성에 정의되지 않은 배경 위치가 정의됩니다.jQuery .css()가 w ​​/ o없이 백그라운드 위치를 얻지 못했습니다! CSS에서 중요합니다.

제가 약간의 수수께끼를 발견 한 이유는 제가 강제로 중요한 규칙을 강요했을 때 그 결과가 나타났습니다.

JQuery와 :

;(function stackoverflowExample(){ 
    "use strict"; 
    $('div').each(function(){ 
    var origPos = $(this).css('backgroundPosition'); 
    alert('original position: '+origPos); // Why?! false return value 0% 0% 
// unless an !important used in the stylerule... 
    }); 
})(); 

CSS의 :

#test1, #test2 { 
    padding: 65px; 
    margin: 50px; 
    color: #fff; 
    font-size: 3rem; 
    text-transform: uppercase; 
    background-position: 500px 500px !important; 
    box-shadow: inset 1px 10px 10pC#000; 
    } 
    #test1 { 
    background: url(http://placehold.it/450x250); 
    margin-bottom: 900px; 
    } 
    #test2 { 
    background: url(http://lorempixel.com/b/1800/800/); 
    } 

그리고 마지막으로, 마크 업 (옥) :

main 
    h1 This is a parallax scrolling demo 
    div#test1 test1 
    div#test2 test2 

그는 re는로드시 배경 코드를 알려주는 데모이며, 이번에는 중요하지 않은 점에 유의하십시오. 이 경우 jQuery는 백그라운드 위치를 0 % 0 %로 경고합니다. 흠 ..

http://codepen.io/nicholasabrams/pen/qEVbpd

지금 위와 아래 데모의 유일한 차이는 #의 TEST1 및 #의 TEST2의 배경 위치가를 HADE 점이다! 중요한 플래그는 그들에게 추가, 당신은이 짐작 시간 jQuery는 예상대로 위치를 찾고 값을 리턴합니다.

http://codepen.io/nicholasabrams/pen/ogoLyV

덕분에 모두가 어쨌든에서 자세히 설명 할 수 있는지 알려주세요!

답변

2

배경 위치 이후에 배경 이미지를 설정하고 있기 때문에 배경 위치를 포함하여 모든 배경 속성을 설정하는 약식 "배경"을 사용하고 있기 때문입니다.

사용 : 대신

background-image: url(http://placehold.it/450x250); 

.

+0

감사! 그게 내가 멸시하는 경험이라고 부르는 것입니다! –