<!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:
<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>