我试图在单击按钮时让轮盘赌旋转,但我似乎无法将从我的 js 文件生成的随机数传递给 css
JS
function roulette_spin(btn){
var rand = Math.floor(Math.random() * 720) + 540;
$('.roulette_wheel').css('transform','rotate('+rand+'deg)');
}
HTML
<body>
<div class="roulette_wheel" style="z-index: 0;">
<img src="ayy.jpg" width="500px" height="500px" />
<button value="spin" onclick="roulette_spin(this)">SPIN</button>
</div>
最佳答案
这是一个工作示例,对您的代码进行了一些更新。
就像@H.Figueiredo 建议的那样,我已将旋转选择器更改为 img
以避免按钮旋转。
HTML
<div class="roulette_wheel" style="z-index: 0;">
<img src="https://picsum.photos/200/300" width="500px" height="500px" />
<button class="spin" value="spin">SPIN</button>
</div>
CSS
function roulette_spin(btn){
var rand = Math.floor(Math.random() * 720) + 540;
$('.roulette_wheel img').css('transform','rotate('+rand+'deg)');
}
$('.spin').click(function(){
roulette_spin($(this).siblings('img'));
});
关于javascript - 使用 css 和 jQuery 制作图像旋转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54886799/