0

我认为这是一个经典问题:考虑到网页中的大画布,我怎样才能将它放在带有滚动条的小 DIV 中?我在堆栈溢出中发现了很多这样的问题,但是,由于我是新手,我无法在我的 IDE 中重现这些示例。

这里有一些答案: -这里

-在这里

这是我的一个非工作代码:

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=windows-1252" http-equiv="content-type">
    <title></title>
    <script type="text/javascript" src="raphael-min.js"></script>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">

        function graphiques(){

        var paper = Raphael('holder', 800, '100%');
        // add your graphics to the paper object here
        var rect=paper.rect(50,50,70,20,5).attr("fill":"#cc3");
        var height = $(paper.canvas).outerHeight();
        paper.setSize(800, height);
        $(paper.canvas).parent().height("100px");
  }
    </script>
  </head>
  <body onload="graphiques();">
      <div id="holder" style="overflow-y:auto;overflow-x:auto;">
      <script>graphiques();</script>
      </div>

  </body>
</html>

我的问题是:我需要进行哪些更改才能使其正常工作?如果我的代码方向错误,那么正确的方法是什么(请使用代码,我是高级 javascript 用户!)

谢谢

奥利维尔

4

1 回答 1

1

解决了:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Rapha�l tutorial - Getting Started - Example 1</title>
<script type="text/javascript" src="raphael-min.js"></script>
<style type="text/css">
  #paper1{
    width: 100px;
    height: 100px;
    overflow: auto;
  }
</style>
</head>
<body>
<div id="paper1"></div>
<!-- the html element where to put the paper -->
<!-- a script that create's a paper and a rectangle -->
<script type="text/javascript">
var paper = Raphael("paper1", 500,500);

var rect1 = paper.rect(20,30,500,500).attr({fill: "orange"});

</script>

于 2013-11-11T13:35:48.447 回答