2

私のゲームの現時点では、それが完了すると、ランダムな画像が「reveal-wrapper」に渡され、最後に表示されます。

それでもこれを実行したいのですが、この方法ではなく、毎回ランダムなクラスを「revael-wrapper」に追加して、たとえば「.reveal-wrapper.image1」にします。5種類の画像があり、毎回ランダムに1枚選んでほしいです。

現時点でのコードは次のとおりです。

$(document).ready(function () {
    bgImageTotal = 5;
    randomNumber = Math.round(Math.random() * (bgImageTotal - 1)) + 1;
    imgPath = ('images/reward-images/' + randomNumber + '.png');
    $('.reveal-wrapper').css('background-image', ('url("' + imgPath + '")'));
});

代わりにランダムクラスを追加する方法はありますか？

4

3 に答える 3

4

ロジックは既に用意されているので、あとはクラスを追加するだけです。これを試して：

$(document).ready(function () {
    bgImageTotal = 5;
    randomNumber = Math.round(Math.random() * (bgImageTotal - 1)) + 1;
    $('.reveal-wrapper').addClass('image' + randomNumber);
});

あとは、CSS でクラスをセットアップするだけです。

.image1 { background-image: url('images/reward-images/1.png'); }
.image2 { background-image: url('images/reward-images/2.png'); }
.image3 { background-image: url('images/reward-images/3.png'); }
.image4 { background-image: url('images/reward-images/4.png'); }
.image5 { background-image: url('images/reward-images/5.png'); }
于 2012-11-06T08:42:23.127 に答える
0

すでに乱数があり、画像が同じファイル名構造 (image1、image2 など) を持っている場合。

$('.reveal-wrapper').addClass('image' + randomNumber);
于 2012-11-06T08:42:41.403 に答える
0

Rory は優れた解決策を持っていますが、興味がある場合は、もう少し一般的なものを次に示します。

function add_rand_class (classes, elem) {
  $(elem).addClass(classes[Math.random() * classes.length >> 0]);
}

関数に、クラス文字列の配列と、クラスが必要な要素を渡せば、準備完了です。

于 2012-11-06T08:46:45.470 に答える