2012-02-19 3 views
0

jquery 통해 해상도에 따라 요소의 배경 이미지 위치를 변경하려고합니다. 코드 :jquery 여러 배경에 CSS 배경 위치를 변경하려면

는 CSS에서
var pwwidth = $(window).width(); 
var pwheight = $(window).height(); 
var bg1posx = pwwidth - $('h1.portofolio').width(); 
var bg1posy = pwheight - $('.footer').height(); 
var bg2posx = $('.leftporto').width() - (pwwidth * 0.05); 
var bg2posy = ($('h1.portofolio').height()/2) + $('h1.portofolio').css('margin-top').replace('px', ''); 
$('#content4').css('background-position', bg1posx+'px' bg1posy+'px', bg2posx+'px' bg2posy+'px'); 

이 같은 요소의 여러 배경을 변경

background-position: 100px 200px , 300px 400px; 
background-position: 10% 20% , 30% 40%; 

나는

$('#content4').css('background-position', bg1posx+'px' bg1posy+'px', bg2posx+'px' bg2posy+'px'); 

답변

0

에게 당신을 작동하지 않습니다이 같은 jQuery로 변경을 정의 할 수 없습니다 코드에 구문 오류 (문자열의 부적절한 연결)가 있습니다.

나쁜 :

$('#content4').css('background-position', bg1posx+'px' bg1posy+'px', bg2posx+'px' bg2posy+'px');

좋은 :

$('#content4').css('background-position', bg1posx+'px '+bg1posy+'px, '+bg2posx+'px '+bg2posy+'px');​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

+0

나는 이것을 시도하고 그것은 나를 위해 또 다른 오류를 만듭니다. 그것은 window.resize 및 document.ready에서 호출되는 함수가 정의되어 있지 않다고 말합니다. 오류를 수정 한 행을 주석 처리하자 마자 사라집니다. 어떤 이유? – Chris

+0

전체 JS 및 HTML 코드도 게시 할 수 있습니까? 도와주는 것이 훨씬 쉬울 것입니다. – papaiatis

+0

나는 코드를 답으로 게시해야합니까, 아니면 작동을 멈추더라도 모든 것을 온라인에 넣어야합니까? – Chris

0
$("#your_div_id").css("background-position","-100px 0px, 0px 5px"); 

이 1 배경 (왼쪽에서 100 픽셀) 과 (위에서 5px) 2 일

이동합니다

이 기술을 사용하여 슬라이더 카운트 다운 http://jsfiddle.net/UR5jC/

관련 문제