みんなに優しく、解りやすくをモットーに開設しています。 以下のルールを守りみんなで助け合いましょう。
1.ファイルメーカーで解らない事があればここで質問して下さい。 何方でも、ご質問・ご回答お願いします。 （優しく回答しましょう）
You are not logged in.
Pages: 1
お金がないので、ver.17で作成したランタイム・ファイルを数人で使用しています。
ちょっとした1行メッセージ数個を、次々とウインドウの上部あたりに表示させるようなものができないかなと思っています。
そこで、Webビューアを細長くしてページ上部に配置し、HTML、CSS、JavaScriptを以下のように同じ階層に配置しました。HTMLやCSS・JavaScriptは悲しいくらい初心者レベルで分かっていないので、いろんなサイトを参考にしました。HTMLをブラウザで表示させると正しく動くところまではいったのですが、Webビューア上では最初の1行目のメッセージだけが表示されて次に進みません。
どこを直せば動くでしょうか？ご教示いただけたら幸いです。よろしくお願い致します。
＜HTML＞
<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style1.css">
<title></title>
</head>
<body>
<p class="message appear">みかん</p>
<p class="message">りんご</p>
<p class="message">バナナ</p>
<p class="message">パイナップル</p>
<p class="message">キウイ</p>
<script src="flowup.js"></script>
</body>
</html>＜style1.css＞
.message {
display: none;
text-align: center;
}
.message.appear {
display: block;
animation: 2s fadeIn;
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}＜flowup.js＞
const messages = document.querySelectorAll('.message');
let i = 1;
function messageAppear() {
if (i > 4) {
i = 0;
}
messages.forEach(message => {
message.classList.remove('appear');
});
messages[i].classList.add('appear');
i++;
}
setInterval(messageAppear, 3000);古いバージョン（FM19ｖ１まで？）のＷｅｂビューアはＩＥ相当なので、ＩＥで動作チェックしてみては。（最近のＯＳだと難しい？）
FM17だともう直ってたかもしれませんが、デフォルトではIEの7相当の動きだったこともありました。（レジストリで修正なので、ランタイムの場合個別に修正が必要）
himadaneeさま
コメントをありがとうございます。
HTMLファイルをMicrosoft EdgeのInternet Explorerモードで再読み込みしたところ、おっしゃられている通り動きませんでした！！
そうしますと、レジストリをいじる他方法はないでしょうか？
「以下のJavascriptをInternet Explorerで動作させるには、どのように変更したらよいですか？」と、今話題のChatGPTに質問したところ、以下の返答をもらいました。そして、これに変更してみたところ、何と動きました！ChatGPT、恐るべし...ですね。
----ChatGPTの返答はここから↓------------------------------------------
このJavaScriptコードはInternet Explorerで動作しない可能性があります。Internet Explorerは古いバージョンのJavaScriptエンジンを使用しており、最新のECMAScript構文をサポートしていないため、エラーが発生する可能性があります。
このコードをInternet Explorerで動作させるには、以下の変更を行う必要があります。
constをvarに変更する
Internet Explorerはconstキーワードをサポートしていないため、constをvarに変更する必要があります。
Arrow Functionをfunctionキーワードで定義する
Internet ExplorerはArrow Functionをサポートしていないため、Arrow Functionをfunctionキーワードで定義する必要があります。
forEach()メソッドをforループに変更する
Internet ExplorerはforEach()メソッドをサポートしていないため、forループを使用して各要素にアクセスする必要があります。
変更後のコードは以下のようになります。
var messages = document.querySelectorAll('.message');
var i = 1;
function messageAppear() {
if (i > 4) {
i = 0;
}
for (var j = 0; j < messages.length; j++) {
messages[j].classList.remove('appear');
}
messages[i].classList.add('appear');
i++;
}
setInterval(messageAppear, 3000);ただし、Internet Explorerは非常に古いブラウザであり、多くの機能がサポートされていないため、最新のブラウザを使用することをお勧めします。
へえ！
こういった検証可能な質問に関しては、もはや人間不要！？
Pages: 1
[ Generated in 0.005 seconds, 7 queries executed - Memory usage: 557.45 KiB (Peak: 581.38 KiB) ]