YES or NO形式で進んで行く、タイプ別診断を作る糸口を教えてください。

解決済

質問者：waayandesu
質問日時：2015/02/10 10:22
回答数：2件

初めて質問させていただきます。
どうぞよろしくお願いします。

農林水産省のページの中にみんなでごはん、タイプ別診断
というYES or NO形式で進んで行くページがあります。

http://www.maff.go.jp/j/seisan/kakou/mezamasi/fa …

これがそのページのURLです。

このページと同様のものを私ども会社のホームページに作って載せようと、
先週から色々と調べたのですが、どうにもこうにも糸口がつかめません。

どなたがご存知の方がおられましたら、どうぞご伝授ください。

私は少々ｈｔｍｌの知識がある程度ですので、できるだけ分かり易く、
具体的にお教えいただけるとありがたいです。

それではどうぞよろしくお願い申し上げます。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： ORUKA1951
回答日時：2015/02/10 10:55

とっても簡単なもの・・・以前回答した

　⇒フルスクリーンについて・・・ - JavaScript | 教えて！goo( https://oshiete.goo.ne.jp/qa/8137881.html )
とか・・

- 1
- 件

通報する

この回答へのお礼

早速のご回答ありがとうございました。
感謝です。

じっくりと拝見させていただき、
また分からないことがありましたら
ご質問させていただきます。

まずは取り急ぎ御礼いたします。

通報する

お礼日時：2015/02/10 11:51

No.2

回答者： DoubtOwl
回答日時：2015/02/10 16:23

ご提示されたURLでは「Flash」というソフトを使っております。

私は10年ほど前に触れたきりなので大分変わっているとは思いますが
Flashを作成するにはなかなか学習コストがかかると思います。

No.1の回答にもありますがJavaScriptまたはjQueryを使用するのが良いと思います。
（jQueryはJavaScriptをより使いやすくしたもの）

例）簡単なサンプル

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1. …
<script>
var questionAnser1;
var questionAnser2;

function question(num, anser)
{
if(num == 1)
{
questionAnser1 = anser;
$("#question1").css("display", "none");
$("#question2").css("display", "block");
return;
}
if(num == 2)
{
questionAnser2 = anser;
$("#question2").css("display", "none");
$("#anser").css("display", "block");
$("#result").text("設問１:" + questionAnser1 + ", 設問２:" + questionAnser2);
return;
}
}
</script>
</head>
<body>

<div id="question1">
設問１
<div>
<input type="button" value="はい" onclick="question(1, 'yes')" />
<input type="button" value="いいえ" onclick="question(1, 'no')" />
</div>
</div>

<div id="question2" style="display:none">
設問２
<div>
<input type="button" value="はい" onclick="question(2, 'yes')" />
<input type="button" value="いいえ" onclick="question(2, 'no')" />
</div>
</div>

<div id="anser" style="display:none">
答え
<div id="result">
</div>
</div>

</body>
</html>