HTML5
<div id="headline"> <div id="telop">
<section id="headline"> <section id="telop"> コンテンツブロックごとに <section> を利用
<div class="page"> <section id="telop">
<article class="page"> <header> <h3> <section id="telop"> <section> のなかでも記事に該当する内容は <article> で定義 <article> の上部で定型的に お決まりで 出力する内容は <header> でまとめる
HTMLだけの状態 <h2> CSSで不可視化
<h1> CSSで不可視化 <section id="headline"> <h2> CSSで不可視化 <section id="kiji"> <h2> CSSで不可視化
<h2> CSSで不可視化
<section id="kiji"> <article class="page"> <h2> CSSで不可視化 <header> <h3> <article class="page"> <h2> CSSで不可視化 以下 繰り返し
<p class="kiji_time"> <time datetime="2012-05-09t14:24+09:00"> 5/9 14:42 </time> 配信 </p> <time> を利用
<audio src="test.mp3"></audio> <video src="test.mp4"></video> <video src="test.mp4" autoplay></video>
<section id="opening"> <div id="page0" class="page"> <div style="position:absolute; left:0px;top:0px; width:1024px;height:768px;"> <video id="opening_video" width="1024" height="768"> <source src="demo.mp4"> </video> </div> </div>
video
codec
codec
codec
Application Cache
CACHE MANIFEST #revision 201205110948 # CACHE: index.html js/jquery-1.4.1.min.js js/jquery.cj-object-scaler.min.js js/jquery-ui.js js/jquery.effects.drop.min.js css/css1024x768.css /css /img offline.appcache
CACHE MANIFEST #revision 201205110948 offline.appcache # CACHE: index.html js/jquery-1.4.1.min.js js/jquery.cj-object-scaler.min.js js/jquery-ui.js js/jquery.effects.drop.min.js css/css1024x768.css /css /img
<html manifest= offline.appcache >
.page{ font-family: RodinPro-EB ; }
.page{ font-family: IwaGNeesPro-Md ; }
Web
jquery
jquery
div{ width:200px; height:200px; background:red; display:none; } $(function(){ $("button").click(function(){ $("div").show("slow"); }); }); <button> </button> <div></div>
div{ width:200px; height:200px; background:red; display:none; } $(function(){ $("button").click(function(){ $("div").show("drop",{direction: "down"}, 2000); }); <button> </button> <div></div>
hanafusaseii@shikoku-np.co.jp Twitter:@newsshop Facebook:Seiichiro.Hanafusa