私はdijit dialog
です。画像のサイズに合わせてダイアログサイズを設定する必要があります。イメージサイズを取得し、それに応じてdivサイズを設定してください
これを達成するには、ダイアログを作成してイメージからプロパティを取得する前にイメージをロードする必要があります。画像onload()
の方法は私の要件を満たしていません。なぜなら、ダイアログを作成してその上に画像を置く前にサイズが必要だからです。誰も私にこの問題を解決する方法を教えてもらえますか?
ありがとうございます。
私はdijit dialog
です。画像のサイズに合わせてダイアログサイズを設定する必要があります。イメージサイズを取得し、それに応じてdivサイズを設定してください
これを達成するには、ダイアログを作成してイメージからプロパティを取得する前にイメージをロードする必要があります。画像onload()
の方法は私の要件を満たしていません。なぜなら、ダイアログを作成してその上に画像を置く前にサイズが必要だからです。誰も私にこの問題を解決する方法を教えてもらえますか?
ありがとうございます。
イメージをアップロードする前に、サイズを にする必要があるため、image onload()メソッドが私の要件を満たしていません。
3つのステップ:
display: none
のデフォルトを与える(または任意のスペースを取る)それがロードするとき。イメージが読み込まれたときにjavascriptが検出し、ダイアログサイズを設定する関数が実行されました。
display:none
をdisplay:block
またはdisplay:inline-block
に置き換えるためにjavascriptを使用してください。
ダイアログをインスタンス化する前にイメージプロパティを取得できます。
注dialog
dijitのリサイズそのウィンドウが、それは幅(あなたがして固定を強制することはできません)
ここでは、スニペットクリックでのものより小さい大きい - サンプル
require(["dijit/Dialog","dijit/form/Button","dojo/domReady!"],function(Dialog,Button){
var imageUrl = "https://cdn.elegantthemes.com/blog/wp-content/uploads/2015/02/custom-trackable-short-url-feature.png";
var dialog
var image = new Image();
// passing src image url to call onload function without add to dom
image.src = imageUrl;
image.onload = function(e) {
\t console.log(image.width);
console.log(image.height);
dialog = new Dialog({
title: "My Dialog",
/* if you want to pass the image */
content: "<img src='"+imageUrl+"' />",
style: "width:"+image.width+"px"
});
}
var btn = new Button({
label: "Show me !",
onClick: function(){
dialog.show();
}
}, "btn").startup();
\t
});
<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css" rel="stylesheet"/>
<body class="claro">
<div id="btn"></div>
</body>
body.onload()を使用できます。 – GraveyardQueen
あなたが試したことを示してください。ダイアログを作成する前にサイズが必要な場合は、 –
の前ではなく、イメージのロード時にイメージを作成してください( 'var i = new Image(); i.src =" url ";')、読み込まれた後、ダイアログを作成し、イメージを追加します。キャッシュされてすぐに表示されます。 –