1

Dojo を使用して div の背景画像を変更する簡単な方法を探していました。それは十分に簡単だと確信していますが、正しい方法を見つけることができませんでした。

var chartDiv = dojo.byId('idChart');
dojo.setStyle(chartDiv, 'background-image', url('http://static2.grsites.com/archive/textures/yello/yello001.jpg'));
<link href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.2/dojo/resources/dojo.css" rel="stylesheet" />
<link href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.2/dijit/themes/claro/claro.css" rel="stylesheet" />
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js" djConfig="parseOnLoad:true"></script>

<body class="claro">
  <div id="idChart">
    <div style="float: left">
      <h3 style="color:DarkSlateGray;">Readmission Risk: <span id='idEstimatedRisk'>    </span></h3>
    </div>
  </div>

このように使用してもページは何も変わりません。Dojo を使用してそれを行う別の方法を見つけることができませんでした。

事前にご協力いただきありがとうございます

4

2 に答える 2

0

あなたが望む効果を達成するために、あなた自身のコードの主な問題は、幅と高さを指定しなかったことだと思います. これらは、背景画像のサイズを設定するために必要です。

HTML を次のように定義しました。

require(["dojo/parser", "dojo/query", "dojo/dom-style", "dojo/ready"],
  function(parser, query, domStyle, ready) {
    ready(function() {
      var myNode = query("#idChart")[0];
      domStyle.set(myNode,
        "background-image",
        "url(http://static2.grsites.com/archive/textures/yello/yello001.jpg)");
    });
  }
);
<link href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.2/dojo/resources/dojo.css" rel="stylesheet" />
<link href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.2/dijit/themes/claro/claro.css" rel="stylesheet" />
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js" djConfig="parseOnLoad:true"></script>

<body class="claro">
  <div id="idChart" style="width: 100px; height: 100px;">
    <div style="float: left">
      <h3 style="color:DarkSlateGray;">Readmission Risk: <span id='idEstimatedRisk'>100</span></h3>
    </div>
  </div>

そして、これはあなたが要求した結果を達成しました

于 2013-11-06T20:21:20.750 に答える