GGB数学云 GGB+JS样例4 - 切换多个模型

GGB+JS样例4 - 切换多个模型

2016年11月22日 人阅读 GeoGebra»GGB+JS样例

摘要: 本文介绍基于GeoGebra和JavaScript的小程序样例 - 多个GGB模型在一页切换。

网页代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>多个GGB模型在一页切换</title>
<style type="text/css">
[id^=applet] {
display: none;
}
</style>
</head>
<body>
<button id="show1">小图</button>
<button id="show2">大图</button>
<div id="applet1"></div>
<div id="applet2"></div>
<script src="http://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
<script src="../GeoGebra/deployggb.js"></script>
<script>
var applet1 = new GGBApplet({filename: '2d.ggb', width: 200, height: 200});
var applet2 = new GGBApplet({filename: '2d2.ggb', width: 600, height: 600, showToolbar: true});
applet1.setHTML5Codebase('../GeoGebra/HTML5/5.0/web/', true);
applet2.setHTML5Codebase('../GeoGebra/HTML5/5.0/web/', true);
window.onload = function() {
applet1.inject('applet1', 'html5');
applet2.inject('applet2', 'html5');
$('[id^=show]').click(function() {
$('[id^=applet]').hide();
$(this.id.replace('show', '#applet')).show();
});
};
</script>
</body>
</html>
分享到: 更多