0

これは古典的な質問だと思います.Webページの大きなキャンバスを考えて、スクロールバーのある小さな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 に答える