スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

jQueryで4コママンガ

FC2 ブログで jQuery が動作するかどうかの確認。前回の続き。

コミPo!で作った4コママンガです。

画像をクリックすると、次のコマに進みます。

とりあえず、この記事を投稿した時点では動作しました。

プログラム

記事の中に以下のプログラムを挿入しました。

<script type="text/javascript"
 src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
<script type="text/javascript">
<!--
var pics = new Array(
  "http://blog-imgs-49.fc2.com/y/o/s/yoshiiz/111125_comic_001.png",
  "http://blog-imgs-49.fc2.com/y/o/s/yoshiiz/111125_comic_002.png",
  "http://blog-imgs-49.fc2.com/y/o/s/yoshiiz/111125_comic_003.png",
  "http://blog-imgs-49.fc2.com/y/o/s/yoshiiz/111125_comic_004.png"
);
var page = 1;

$(function(){
  $("#koma").click(function(){
    if (page < pics.length) {
      $(this).attr("src", pics[page]);
      page++;
    }
    else {
      $(this).attr("src", pics[0]);
      page = 1;
    }
  })
});
-->
</script>

<p style="margin: 1em 0em; text-align: center;">
<img id="koma"
 src="http://blog-imgs-49.fc2.com/y/o/s/yoshiiz/111125_comic_001.png"
 width="300" height="240" style="border: none;">
</p>

画像は、あらかじめ FC2 ブログの管理画面の [ツール] → [ファイルアップロード] でアップロードしておきます。

FC2ブログ公式マニュアル:ファイルをアップロードする

画像のURLは、同じく [ツール] → [ファイルアップロード] において、アップロードした画像のリンク先を見ることで確認できます。

【theme : プログラミング
【genre : コンピュータ

プロフィール

よしいず

Author:よしいず
MATHEMATICS.PDFというウェブサイトを運営しています。

管理の都合上、トラックバックとコメントはオフにしてあります。ブログ経験者なら分かっていただけると思いますが、スパム(アダルトやその他の宣伝)ばかりなのが現実です。

リンクは自由です。当サイトの記事に対する間違いの指摘・意見・感想などを述べた記事からのリンクは歓迎です。ただし、ブログ記事アップ直後はミスが多く、頻繁に修正します。場合によっては削除する可能性もあります。その際、何も断りもなく修正・削除しますがご了承ください。内容を参考にする場合には投稿後一週間ほど様子を見てからにしてください(笑)。

記事の間違いを指摘するときは、その具体的箇所、理由(仕様に反するなど)・根拠(参考にした文献など)、代替案(同じ結果を得るための正しいやり方)も教えてください。そうしないと、(指摘される側および第三者はその時点では無知の状態なので、)どこが間違いなのか分かりませんし、本当に間違っているのかどうかが判断・検証できません。実際、間違いだと指摘されたことが結局は正しかったというケースもありますので。

このブログのタイトル一覧

リンク
月別アーカイブ
カテゴリ
最新記事
検索フォーム
RSSリンクの表示
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。