1

jqueryを使用して、解像度に応じて要素の背景画像の位置を変更しようとしています。コード:

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');

CSSでは、次のように要素の複数の背景を変更します。

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

これは機能しないため、jqueryで変更するように定義することはできません

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

2 に答える 2

0
于 2012-02-19T18:07:15.297 に答える
0
$("#your_div_id").css("background-position","-100px 0px, 0px 5px");

this will move the 1st background (100px on left) and the 2nd one (5px from top)

I'm using this technique to build a slider countdown take a look http://jsfiddle.net/UR5jC/

于 2013-01-24T15:04:58.507 に答える