私のウェブサイトでJavaScriptを実行し、画像がどのように読み込まれるかについての初心者の質問があります。動画の読み込みgoogle chrome
本質的に、私は中小企業の所有者のための簡単な画面上の請求書を生成するページを開発しました。所有者はページに移動してボタンをクリックし、インボイスに入力するためのさまざまな入力を求められます。彼らは自分のロゴの画像、彼らがした仕事のリスト(彼らが請求したもの)、下の連絡先などを入力するよう求められます。
これは基本的なことですが、専門的にこれを行うサービスがたくさんあることはわかっていますが、私は小規模ビジネスを持っています&は、& JSを学びたいと思っていました。
私の特に問題は、ユーザーがURLを入力したときのロゴ画像の表示方法です。ユーザがスタートボタンをクリックすると、ロゴのURLが表示されます。次に、表示されている画像に満足するかどうかを確認するスクリプトが表示されます(図形&のサイズ)。
IE11でサイトを読み込むと、ユーザーがURLを入力するとすぐにイメージが表示されます。この方法で、彼らはすぐにそれを見ることができます&彼らはそれに満足しているかどうかを決定します。問題は、Google Chromeで実行すると、請求書生成プログラム全体が実行されるまでイメージが読み込まれないことです。つまり、プログラムを構成するすべてのJSスクリプトが実行されるまで、イメージは表示されません。
言うまでもなく、これは、プログラムが終了するまで、画面上に表示されないため、ユーザーがロゴを表示しようとする試みに制限されていることは言うまでもない。なぜIE 11ではすぐに表示されますが、Chromeでは表示されません。また、できるだけすぐにChromeに表示するにはどうすればよいですか?
ページへのリンクはここGenerate Invoice
ある画像に対して求められJSコードであり、ユーザが好きなように、それは、再サイズを表示します。
var url = prompt("Enter the URL for a picture of your logo:");
// create the IMG element to display the logo
var image = document.createElement("IMG");
// assign the user-input url to the variable holding the IMG element
image.src=url;
// Create a variable to assign the DIV to (by ID)
var imageLogo = document.getElementById("addLogoAndMessage");
// Clear out the DIV (i.e. make the button go away)
imageLogo.innerHTML = "";
// Append the image to the variable associated with the DIV
imageLogo.appendChild(image);
// custom width for CE logo is 220px
var logoWidth = prompt("Set a width for your logo.");
var logoWidth1 = logoWidth + "px";
imageLogo.appendChild(image).style.width = logoWidth1;
// custom height for CE logo is 200px
var logoHeight = prompt("Set a height for your logo. To maintain aspect ratio, just hit Enter.");
var logoHeight1 = logoHeight + "px";
if (logoHeight == "" || logoHeight == "undefined") {
imageLogo.appendChild(image).style.height = "auto";
} else {
imageLogo.appendChild(image).style.height = logoHeight1;
}
var sizeOK = prompt("Are you happy with the shape and size of your logo (y/n)?");
while (sizeOK != "n" && sizeOK != "y") {
sizeOK = prompt("Are you happy with the shape and size of your logo (y/n)?");
}
while (sizeOK == "n") {
var logoWidth = prompt("Set a new width for your logo.");
var logoWidth1 = logoWidth + "px";
imageLogo.appendChild(image).style.width = logoWidth1;
var logoHeight = prompt("Set a new height for your logo. To maintain aspect ratio, just hit Enter.");
var logoHeight1 = logoHeight + "px";
if (logoHeight == "" || logoHeight == "undefined") {
imageLogo.appendChild(image).style.height = "auto";
} else {
imageLogo.appendChild(image).style.height = logoHeight1;
}
// Ask after every width,height set so user can stop when they like the image
sizeOK = prompt("If you're still not happy with your logo, enter 'n'. Otherwise, just hit Enter.");
}
ありがとうございました。