如何使用onclick多次更改变量的值?

时间:2013-04-17 04:31:13

标签: javascript html

我是一名JS新手,最近我发现了一个用于创建增强现实应用程序的SDK,其中html / css / js称为wikitude。当你看到下面的内容时,你会看到一个按钮,当点击它时会调用scaleModel函数,然后为scale属性创建新值,这将允许我的应用程序显示的3d模型的大小增加。我只是希望能够创建一个按钮,每次按下它时都会增加值,而另一个按钮会在每次按下时减小值。这样我就会有两个按钮,一个用于增大尺寸,另一个用于减小尺寸。我非常感谢你的帮助。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="viewport" content="target-densitydpi=device-dpi, width = 540, user-scalable = 0" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>My ARchitect World</title>
<script src="architect://architect.js"></script>
<script>
var model;
var location;

function createModel()
{
AR.logger.activateDebugMode();
AR.logger.info("info");

var modelOptions = {
    scale: {x: 0.1, y: 0.1, z: 0.1},
    rotate: {heading: -30},
    rotate: {tilt: 30},
    translate: {y: -0.5}
};

model = new AR.Model("my3dModel.wt3", modelOptions);
location = new AR.RelativeLocation(null, 0, -50, 0);
var myGeoObject = new AR.GeoObject(location, {drawables: {cam: model}});
}

function scaleModel() {
model.scale.x = 0.5;
model.scale.y = 0.5;
model.scale.z = 0.5;
}

</script>
</head>

创建动画 规模

1 个答案:

答案 0 :(得分:1)

如果你创建一个像scaleModel()函数这样的新函数,它将比例乘以一个数量而不是设置它:

function scaleModelBy(amount) {
    model.scale.x = model.scale.x * amount;
    model.scale.y = model.scale.y * amount;
    model.scale.z = model.scale.z * amount;
}

然后您可以在某些按钮中调用它:

<button onclick="scaleModelBy(2);">Scale up</button>
<button onclick="scaleModelBy(0.5);">Scale down</button>