2015年3月16日月曜日

開発環境

  • OS X Yosemite - Apple (OS)
  • Safari, Firefox, Google Chrome(Webプラウザ)
  • Emacs (CUI)、BBEdit - Bare Bones Software, Inc.(GUI) (Text Editor)
  • JavaScript (プログラミング言語)

Head First jQuery(Ryan Benedetti(著)、Ronan Cranley(著)、O'Reilly Media)のChapter 8(jQuery and Ajax: Please Pass the Data)、HTML MAGNETS(No. 4157)を解いてみる。

その他参考書籍

HTML MAGNETS(No. 4157)

HTML5(BBEdit, Emacs)

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>2011 Race Finishers</title>
    <link rel="stylesheet" href="styles/my_style.css"> 
  </head>
  <body>
    <header>
      <h2>2011 Race Finishers!</h2>
    </header>
    <section id="main">
      <ul class="idTabs">
        <li><a href="#male">Male Finishers</a></li>
        <li><a href="#female">Female Finishers</a></li>
        <li><a href="#all">All Finishers</a></li>
      </ul>
      <div id="male">
        <h4>Male Finishers</h4>
        <ul id="finishers_m"></ul>
      </div>
      <div id="female">
        <h4>Female Finishers</h4>
        <ul id="finishers_f"></ul>
      </div>
      <div id="all">
        <h4>All Finishers</h4>
        <ul id="finishers_all"></ul>
      </div>
    </section>
    <footer>
      <h4>Congratulations to all our finishers!</h4>
      <br>Last Updated: <div id="updatedTime"></div>
    </footer>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="scripts/my_scripts.js"></script>
    <script src="scripts/jquery.idTabs.min.js"></script>
  </body>
</html>

index4157.html

0 コメント:

コメントを投稿