横浜、東京に拠点を置き、検証システム/金融・証券のシステム等の構築、開発を行い、
検証ツールの支援と多岐にわたるソリューションを提供します。
画面遷移のスライドダウンアニメーション
data-transition属性に data-transition="slidedown"を指定すると
ページが上から下にスライドしてページが切り替わる、スライドダウンアニメーションで表示します
画面遷移をスライドダウンアニメーション
<!DOCTYPE html> <html lang="ja"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1"> <title>スライドダウンアニメーション | スマホ勉強室 jQuery Mobile 11-07 | 株式会社アイネックス | Webシステム構築 | AS400ソリューション | データ復旧サービス |ホームページ作成</title> <link href="../mobile_css/jquery.mobile-1.1.0.min.css" rel="stylesheet" title="CSS" type="text/css" /> <script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="../js/jquery.mobile-1.1.0.min.js"></script> <script src="http://maps.google.com/maps/api/js?sensor=false"></script> <!-- Google マップ(緯度経度)をスクリプト --> <link href="styles/mobi-style.css" media="all" rel="stylesheet" title="CSS" type="text/css" /> <script type="text/javascript" src="js/mobi-gmap.js"></script> </head> <body> <!-------------------------------------------------------> <!-- ページ全体の宣言 data-role="page" --> <!-------------------------------------------------------> <div data-role="page" id="index" data-theme="b"> <div data-role="header" data-theme="b"> <a href="menu2.html" data-icon="arrow-l" >メニュー</a> <h1>株式会社アイネックス</h1> </div> <div data-role="content"> <ul data-role="listview" data-theme="c" data-inset="true"> <li data-role="list-divider">11-07 スライドダウンアニメーション Menu</li> <!-- 画面遷移アニメーションの宣言 data-transition="slidedown" --> <li><a href="#about" data-transition="slidedown"> <h3>会社案内</h3> </a></li> <!-- 画面遷移アニメーションの宣言 data-transition="slidedown" --> <li><a href="#seminar" data-transition="slidedown"> <h3>セミナー情報</h3> </a></li> <!-- 画面遷移アニメーションの宣言 data-transition="slidedown" --> <li><a href="#access" data-transition="slidedown"> <h3>アクセス</h3> </a></li> <!-- 画面遷移アニメーションの宣言 data-transition="slidedown" --> <li><a href="#contact" data-transition="slidedown"> <h3>お問い合わせ</h3> </a></li> </ul> </div> <div data-role="footer" data-theme="b"> <h4><small>Copyright © 2012 inex.Co,Ltd All Rights Reserved.</small></h4> </div> </div> <!--------------------------------------------------> <!-- 会社案内ページの宣言 data-role="page" --> <!--------------------------------------------------> <div data-role="page" id="about" data-theme="c"> <div data-role="header" data-theme="b"> <a href="#index" data-icon="arrow-l" data-transition="slidedown" data-direction="reverse">TOP</a> <h1>株式会社アイネックス</h1> </div> <div data-role="content"> <h2>会社案内</h2> <p>株式会社アイネックスは横浜/東京を中心に活動するホームページ作成の会社です。</p> <p>PHPやJavaScript/Ajaxによるシステム開発や、Movable TypeなどのCMSを利用したWEBサイト制作、SEO対策・SEM対策などのマーケティング、コンサルティングを行っております。</p> <h2>会社概要について</h2> <p>1986年創立</p> <p>主な開発実績・・<a href="https://www.inex.co.jp/jigyou/index.html" target="_top">事業案内</a></p> </div> <div data-role="footer" data-theme="b"> <h4><small>Copyright © 2012 inex.Co,Ltd All Rights Reserved.</small></h4> </div> </div> <!--------------------------------------------------> <!-- セミナー情報ページの宣言 data-role="page" --> <!--------------------------------------------------> <div data-role="page" id="seminar" data-theme="c"> <div data-role="header" data-theme="b"> <a href="#index" data-icon="arrow-l" data-transition="slidedown" data-direction="reverse">TOP</a> <h1>株式会社アイネックス</h1> </div> <div data-role="content"> <h2 class="h1">セミナー情報</h2> <ul data-role="listview" data-inset="true"> <li><a href="https://www.inex.co.jp/jigyou/jigo11-1.html" target="_top"> <h3>検証システム</h3> <p>横浜市 ITプラザみなと未来 6F ホール</p> <p>2012年6月11日</p> </a></li> <li><a href="https://www.inex.co.jp/jigyou/jigo21-1.html" target="_top"> <h3 class="wordbreak">Webシステム開発とVHDLとの連携 ハードウェーの設計講座</h3> <p>テキストの自動省略機能 off</p> <p>野毛山動物園 ワークショップ</p> <p>2012年7月14日</p> </a></li> <li><a href="https://www.inex.co.jp/jigyou/jigo31-1.html" target="_top"> <h3>AS400 為替システム</h3> <p>神奈川県産業振興センター</p> <p>2012年7月23日</p> </a></li> </ul> </div> <div data-role="footer" data-theme="b"> <h4><small>Copyright © 2012 inex.Co,Ltd All Rights Reserved.</small></h4> </div> </div> <!--------------------------------------------------> <!-- アクセスページの宣言 Google マップ --> <!--------------------------------------------------> <div data-role="page" id="access" data-theme="c"> <div data-role="header" data-theme="b"> <a href="#index" data-icon="arrow-l" data-transition="slidedown" data-direction="reverse">TOP</a> <h1>株式会社アイネックス</h1> </div> <div data-role="content"> <h3 class="h1">アクセス</h3> <h2 class="h1">株式会社 アイネックスの地図</h2> <div id="map" class="ui-shadow"></div> </div> <div data-role="footer" data-theme="b"> <h4><small>Copyright © 2012 inex.Co,Ltd All Rights Reserved.</small></h4> </div> </div> <!--------------------------------------------------> <!-- お問い合わせページの宣言 data-role="page" --> <!--------------------------------------------------> <div data-role="page" id="contact" data-theme="c"> <div data-role="header" data-theme="b"> <a href="#index" data-icon="arrow-l" data-transition="slidedown" data-direction="reverse">TOP</a> <h1>株式会社アイネックス</h1> </div> <div data-role="content"> <h2 class="h1">お問い合わせ</h2> <!-------------------------------------------------------> <!-- フォームの宣言 --> <!-------------------------------------------------------> <form action="../motion1/php/form_disp.php" method="post"> <div data-role="fieldcontain"> <label for="name">名前</label> <input type="text" name="name" id="name"> </div> <div data-role="fieldcontain"> <label for="gender">性別</label> <select name="gender" id="gender"> <option value="男性">男性</option> <option value="女性">女性</option> </select> </div> <div data-role="fieldcontain"> <fieldset data-role="controlgroup"> <legend>お問い合わせ種別</legend> <input type="checkbox" name="type1" id="type1" value="HP新規作成"/> <label for="type1">HP新規作成</label> <input type="checkbox" name="type2" id="type2" value="HPリニューアル"/> <label for="type2">HPリニューアル</label> <input type="checkbox" name="type3" id="type3" value="システム開発"/> <label for="type3">システム開発</label> <input type="checkbox" name="type4" id="type4" value="コンサルティング"/> <label for="type4">コンサルティング</label> </fieldset> </div> <div data-role="fieldcontain"> <label for="textarea">お問い合わせ内容</label> <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea> </div> <input type="submit" value="キャンセル" data-theme="b" data-icon="delete" data-inline="true"> <input type="submit" name="submit" value="送信" data-theme="b" data-icon="arrow-r" data-inline="true"> </form> </div> <div data-role="footer" data-theme="b"> <h4><small>Copyright © 2012 inex.Co,Ltd All Rights Reserved.</small></h4> </div> </div> </body> </html> |