IT:programing
2013年06月11日
jQueryを活用して、
動的表現のあるクイズを作成してみる.
銀豚クイズページにて.
クイズにはずれると、
「はずれ!」とPOP UP表示され、
当たると、、
↑「正解!」というPOP UP!
作成方法は・・・
head内に下記コードを入力
さらに、
body内に下記コードを入力
動的表現のあるクイズを作成してみる.
銀豚クイズページにて.
クイズにはずれると、
「はずれ!」とPOP UP表示され、
当たると、、
↑「正解!」というPOP UP!
作成方法は・・・
head内に下記コードを入力
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<title>クイズ</title>
<script>
$(function() {
$('input').click(function() {
if ($(this).val() == 2) alert('正解!');
else alert('はずれ!');
});
});
</script> さらに、
body内に下記コードを入力
<p>あなたの好きな食べ物は?</p>
<p>
<input type="radio" name="food" value="1">まつりぶんたろう
<input type="radio" name="food" value="2">さいもんだろう
<input type="radio" name="food" value="3">さいぶんたろう
</p>
以上.
POINTは、下記コードで、
以上.
POINTは、下記コードで、
if ($(this).val() == 2) alert('正解!');
else alert('はずれ!');
「2」を選んだら、「正解!」とPOP UPされ、
それ以外を選んだら、「はずれ!」とPOP UPされるように
司令を出している.
「2」を選んだら、「正解!」とPOP UPされ、
それ以外を選んだら、「はずれ!」とPOP UPされるように
司令を出している.
WEB SITEで動的な表現をしたい場合、
jQuery(ジェイクエリー)が便利.
たとえば、
銀豚スケジュールページに、
↑蜃気楼と文字を入れてみる.
で、
CLICKすると・・・
↑消える!という演出
方法は・・・
head内に下記コードを入力
さらに、
body内に下記コードを入力
<p>おばけー</p>
実にカンタン!
jQuery(ジェイクエリー)が便利.
たとえば、
銀豚スケジュールページに、
↑蜃気楼と文字を入れてみる.
で、
CLICKすると・・・
↑消える!という演出
方法は・・・
head内に下記コードを入力
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<title>蜃気楼</title>
<script>
$(function() {
$('p').click(function() {$(this).fadeOut('slow');});
});
</script> さらに、
body内に下記コードを入力
<p>おばけー</p>
実にカンタン!
2013年06月10日
「お問い合わせフォーム」の件、
先日、オリジナルで作ってみたものの、
もっとカンタンな方法があることを発見!
Google Drive(グーグルドライブ)のアンケート機能を
使えばイイ.
↑早速、作成してみた.
方法は、
Access to Google Drive.
そして、
新規作成 > フォーム
で、
↑デザインをSELECTし、
↑回答項目をどんどん入れていくだけ.
なお、
回答内容は、
↑テキスト、
ラジオボタン、
チェックボックス等、
選べる.
単一回答の場合、ラジオボタン、
複数回答の場合、チェックボックス
を選べばOK!
回答データは、
Google Drive内にEXCEL形式で自動的に整理されて表示される.
データの書き出しも可能.
以前にMailで集めたこともあったけど、
このまとめる作業がすごく大変だったが、
この方法なら便利.