Today & Tomorrow...

勝手気ままな、備忘録的な感じです。

【jQuery mobile】

【jQuery mobile】
とりあえず動きの確認を一通りやってみました。
http://rara.mods.jp/08081

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>無題ドキュメント</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
	$(document).bind("mobileinit", function(){
	$.mobile.defaultTransition = "flip";
	});
</script>
</head>

<body>
<div data-role="page" id="page">
  <div data-role="header">
  <a href="#page2">home</a>
    <h1>page1</h1>
    <a href="#page12">save</a>
  </div>
  <div data-role="content">
  <ul data-role="listview" data-split-theme="e">
<li>list
<ul>
<li><a href="#page12">list2</a></li>
<li><a href="#page10">list2</a></li>
<li><a href="#page4">list2</a></li>
</ul>
</li>
<li>list</li>
<li>list</li>
<li>list</li>
<li><a href="#page12">list</a></li>
</ul>
</div>
	<div class="ui-bar">
		<a href="#page11">Remove</a>
    <a href="#page5">Add</a>
    <a href="#page2" data-transition="slideup">Up</a>
    <a href="#page4" data-transition="slidedown">Down</a>
	</div>
  
  <div data-role="footer">
    <h4>page1</h4>
  </div>
</div>

<div data-role="page" id="page2"> 
<div data-role="header">
<h1>ページ2</h1>
</div>

<div data-role="content">
<ul data-role="listview"  data-split-icon="gear">
  <li><a href="#page7">list</a><a href="#page9">detail</a></li>
  <li><a href="#page3">list</a><a href="#page12">detail</a></li>
  <li><a href="#page10">list</a><a href="#page8">detail</a></li>
  <li><a href="#page5">list</a><a href="#page4">detail</a></li>
  <li><a href="#page6">list</a><a href="#page">detail</a></li>
</ul>
</div>

<div data-role="footer">
<h4>page2</h4>
</div>
</div>

<div data-role="page" id="page3">
  <div data-role="header">
    <h1>page3</h1>
  </div>
  <div data-role="content">
    <ol data-role="listview" data-inset="true">
      <li><a href="#page7">ページ</a></li>
      <li><a href="#page8">ページ</a></li>
      <li><a href="#page11">ページ</a></li>
    </ol>
  </div>
  <div data-role="footer">
    <h4>page3</h4>
  </div>
</div>

<div data-role="page" id="page4">
  <div data-role="header">
    <h1>page4</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview">
   <li><a href="#page10"><h1>見出し</h1><p>説明の内容</p></a></li>
   <li><a href="#page6"><h1>見出し</h1><p>説明の内容</p></a></li>
   <li><a href="#page3"><h1>見出し</h1><p>説明の内容</p></a></li>
   <li><a href="#page5"><h1>見出し</h1><p>説明の内容</p></a></li>
</ul> 
  </div>
  <div data-role="footer">
    <h4>page4</h4>
  </div>
</div>
<div data-role="page" id="page5">
  <div data-role="header">
    <h1>page5</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview">
    <li><a href="#page3" data-transition="slideup"><p class="ui-li-aside">2012年2月11日</p><h1>見出し</h1><p>説明の内容</p></a></li>
    <li><a href="#page2"><p class="ui-li-aside">2012年2月11日</p><h1>見出し</h1><p>説明の内容</p></a></li>
    <li><a href="#page13" data-transition="slideup"><p class="ui-li-aside">2012年2月11日</p><h1>見出し</h1><p>説明の内容</p></a></li>
    <li><a href="#page6"><p class="ui-li-aside">2012年2月11日</p><h1>見出し</h1><p>説明の内容</p></a></li>
  </ul></div>
  <div data-role="footer">
    <h4>page5</h4>
  </div>
</div>
<div data-role="page" id="page6">
  <div data-role="header">
    <h1>page6</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview">
   <li data-role="list-divider">見出し</li>
   <li><a href="#page7">list</a></li>
   <li><a href="#page10">list</a></li>
   <li data-role="list-divider">見出し</li>   
   <li><a href="#page8">list</a></li>
   <li><a href="#page9">list</a></li>
</ul>
  </div>
  <div data-role="footer">
    <h4>page6</h4>
  </div>
</div>
<div data-role="page" id="page7">
  <div data-role="header">
    <h1>ヘッダー</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview" data-dividertheme="a">
   <li data-role="list-divider">見出し</li>
   <li><a href="#page9" data-transition="slideup">list</a></li>
   <li><a href="#page13" data-transition="pop">list</a></li>
   <li data-role="list-divider" data-transition="slideup">見出し</li>
   <li><a href="#page11" data-transition="slideup">list</a></li>
   <li><a href="#page8" data-transition="pop">list</a></li>
</ul>
  </div>
    


  <div data-role="footer">
    <h4>フッター    <div data-role="navbar">
    <ul>
    <li><a href="#page12" data-transition="slideup">One</a></li>
    <li><a href="#page" data-transition="pop">Two</a></li>
    </ul>
  </div></h4>
  </div>
</div>
<div data-role="page" id="page8">
  <div data-role="header">
    <h1>page7</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview" data-count-theme="e">
   <li><a href="#page" data-transition="slidedown">list<span class="ui-li-count">10</span></a></li>
   <li><a href="#page2" data-transition="flip">list<span class="ui-li-count">10</span></a></li>
   <li><a href="#page3" data-transition="slidedown">list<span class="ui-li-count">10</span></a></li>
   <li><a href="#page4" data-transition="flip">list<span class="ui-li-count">10</span></a></li>
   <li><a href="#page5" data-transition="slidedown">list<span class="ui-li-count">10</span></a></li>
</ul>
  </div>
  <div data-role="footer">
    <h4>フッター</h4>
  </div>
</div>
<div data-role="page" id="page9">
  <div data-role="header">
   <a href="#page" data-direction="reverse" data-transition="flip">TOP</a>
    <h1>ヘッダー</h1>
  </div>
  <div data-role="content">
  <ul data-role="listview">
   <li><a href="#page10" data-transition="pop"><img src="images/pt-f-skull_n.png">list</a></li>
   <li><a href="#page2" data-transition="slidedown"><img src="images/pt-f-mushroom2_n_white2.png">list</a></li>
   <li><a href="#page11" data-transition="pop"><img src="images/pt-f-skull_black.png">list</a></li>
   <li><a href="#page13" data-transition="slideup"><img src="images/pt-f-skull_black_n_white.png">list</a></li>
   <li><a href="#page7" data-transition="flip"><img src="images/pt-f-skull_green.png" class="ui-li-icon">list</a></li>
</ul>
  </div>
  <div data-role="footer">
    <h4>フッター</h4>
  </div>
</div>
<div data-role="page" id="page10">
  <div data-role="header">
    <h1>ヘッダー</h1>
      <div data-role="navbar">
    <ul>
    <li><a href="#page" data-transition="flip">One</a></li>
    <li><a href="#page8" data-transition="slideup">Two</a></li>
    </ul>
  </div>
  </div>
  <div data-role="content">
    <div class="ui-grid-a">
    <div class="ui-block-a"><a href="#page7" data-transition="flip"><strong>I'm Block A</strong></a></div>
    <div class="ui-block-b"><a href="#page13" data-transition="slideup"><strong>I'm Block B</strong></a></div>
    </div>
  
  </div>
  <div data-role="footer">
    <h4>フッター</h4>
  </div>
</div>
<div data-role="page" id="page11">
  <div data-role="header">
    <h1>ヘッダー</h1>
  </div>
  <div data-role="content">
  <div class="ui-grid-b">
		<div class="ui-block-a"><div class=" ui-bar ui-bar-e"><a href="#page12" data-transition="slidedown">Block A</a></div></div>
		<div class="ui-block-b"><div class=" ui-bar ui-bar-e"><a href="#page8" data-transition="slideup">Block B</a></div></div>
		<div class="ui-block-c"><div class=" ui-bar ui-bar-e"><a href="#page10" data-transition="slidedown">Block C</a></div></div>
		</div>
	</div>
  </div>
  <div data-role="footer">
    <h4>フッター</h4>
  </div>
</div>
<div data-role="page" id="page12">
  <div data-role="header">
    <h1>ヘッダー</h1>
  </div>
  <div data-role="content">
  		<div class="ui-grid-b">
		<div class="ui-block-a"><div class=" ui-bar ui-bar-e"><a href="#page13" data-transition="pop">Block A</a></div></div>
		<div class="ui-block-b"><div class=" ui-bar ui-bar-e"><a href="#page11" data-transition="pop">Block B</a></div></div>
		<div class="ui-block-c"><div class=" ui-bar ui-bar-e"><a href="#page9" data-transition="pop">Block C</a></div></div>
		<div class="ui-block-a"><div class=" ui-bar ui-bar-e"><a href="#page8" data-transition="pop">Block A</a></div></div>
		<div class="ui-block-b"><div class=" ui-bar ui-bar-e"><a href="#page7" data-transition="pop">Block B</a></div></div>
		<div class="ui-block-c"><div class=" ui-bar ui-bar-e"><a href="#page6" data-transition="pop">Block C</a></div></div>
		</div>
	</div>
  </div>
  <div data-role="footer">
    <h4>フッター</h4>
  </div>
</div>
<div data-role="page" id="page13">
   <div data-role="header" data-position="fixed">
  <h1>ページ1</h1>
  </div>
  <div data-role="content">
    <ul data-role="listview">
      <li><a href="#page2">list1</a></li>
      <li><a href="#page2">list2</a></li>
      <li><a href="#page2">list3</a></li>
      <li><a href="#page2">list4</a></li>
      <li><a href="#page2">list5</a></li>
      <li><a href="#page2">list6</a></li>
      <li><a href="#page2">list7</a></li>
      <li><a href="#page2">list8</a></li>
      <li><a href="#page2">list9</a></li>
      <li><a href="#page2">list10</a></li>
    </ul>
  </div>
  <div data-role="footer" data-position="fixed">
  <h4>フッター1</h4>
  </div>
</div>

</body>
</html>

【[PHP]まとめ - 基本】

PHP

【[PHP]まとめ - 基本】
このテキストはPHPで記述しています。
このテキストはPHPで記述しています。

100200
佐藤さんと山田さん
佐藤さん、山田さん、鈴木さん。
山田さんは25歳です。
佐藤 20歳
山田 25歳
鈴木 30歳

13
3
40
1.6
13
3

  • 8

代入をおこなう
おはよう
4x12=48
16
13
文字列を扱う
「$a.=$b」は、$aに$aと$bを連結した値を代入する
おはようこんにちは

おはようこんにちはさよなら

aとbは等しい
aとbは等しくない
aはbより小さい
aは0より大きい
aは3以上

主に複数の比較演算子の真偽値から１つの真偽値を導く

aは0より大きく、かつ、ｂは4より大きい

aが3より小さいか、または、bが10と等しい

aは3より大きくない

cは空

状況に応じてプログラムを分岐させる


aはさようなら
｢〜の間ずっとwhile文｣
0
1
2
3
4
5
6
7
8
9

繰り返す回数がわかっているときfor文
0
1
2
3
4
5
6
7
8
9

配列に便利なforeach文
2012
8
1
16
10

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>基本</title>
</head>

<body>
<?php echo("このテキストはPHPで記述しています。"); ?><?php ("<br>"); ?>
<?php print('<div class="text">このテキストはPHPで記述しています。<div>')?><?php print('<br>');?>
<?php echo(100); $a=200; echo($a); ?>
<?php print("<br>"); ?>
<?php 
$name='佐藤';
$Name='山田';
echo($name.'さんと'.$Name.'さん'); ?>
<?php echo('<br>'); ?>
<?php 
 $name=array('佐藤','山田','鈴木');
 echo($name[0].'さん、'.$name[1].'さん、'.$name[2].'さん。');?>
 <?php print('<br>'); ?>
 <?php 
 $profile=array();
 $profile['name']='山田';
 $profile['age']=25;
 echo($profile['name'].'さんは'.$profile['age'].'歳です。'); ?>
  <?php print('<br>'); ?>
  <?php 
	$meibo=array(); 
	$meibo[0]=array('name'=>'佐藤','age'=>20); 
	$meibo[1]=array('name'=>'山田','age'=>25);
	$meibo[2]=array('name'=>'鈴木','age'=>30);
	echo($meibo[0]['name'].' '.$meibo[0]['age'].'歳<br>');
	echo($meibo[1]['name'].' '.$meibo[1]['age'].'歳<br>');
	echo($meibo[2]['name'].' '.$meibo[2]['age'].'歳<br>');
 	?>
    <?php print('<br>'); ?>
    <?php 
		$a=8;
		$b=5;
		echo($a+$b.'<br>');
		echo($a-$b.'<br>');
		echo($a*$b.'<br>');
		echo($a/$b.'<br>');
		echo($a+$b.'<br>');
		echo($a%$b.'<br>');
		echo(-$a.'<br>');
		?>
     <?php print('<br>'); ?>
    <?php print('代入をおこなう'); ?>
    <?php print('<br>'); ?>
    <?php 
		$aisatsu= 'おはよう';
		echo($aisatsu.'<br>');
		$a=12;
		$number=($b=4)*$a;
		echo($b.'x'.$a.'='.$number.'<br>');
		$a+=$b;
		echo($a.'<br>');
		$a-=3;
		echo($a);
		 ?>
     <?php print('<br>'); ?>
     
     <?php print('文字列を扱う' .'<br>' .'「$a.=$b」は、$aに$aと$bを連結した値を代入する');?>
     <?php 
		 $a='おはよう';
		 $b=$a.'こんにちは';
		 echo('<p>'.$b.'</p>');
		 $b.='さよなら';
		 echo('<p>'.$b.'<p>');
		 ?>
     <?php 
		 $a=$b=3;
		 if($a==$b){echo('aとbは等しい<br>');}
		 $b=4;
		 if($a!=$b){echo('aとbは等しくない<br>');}
		 if($a<$b){echo('aはbより小さい<br>');}
		 if($a>0){echo('aは0より大きい<br>');}
		 if($a>=3){echo('aは3以上<br>');}?>
     <?php print('<br>'); ?>
     <?php echo('主に複数の比較演算子の真偽値から１つの真偽値を導く')?>
     <?php
$a = 2;
$b = 9;
if($a > 0 && $b > 4) {
	echo('<p>aは0より大きく、かつ、ｂは4より大きい</p>');
}
if($a < 3 || $b == 10) {
	echo('<p>aが3より小さいか、または、bが10と等しい</p>');
}
if(!($a > 3)) {
	echo('<p>aは3より大きくない</p>');
}
if(!$c) {
	echo('<p>cは空</p>');
}
?>
<?php echo('状況に応じてプログラムを分岐させる'.'<br><br><br>');?>
<?php
$a = 'さようなら';
if($a =='おはよう') {
	echo('aはおはよう');
} elseif($a =='こんにちは') {
	echo('aはこんにちは');
} elseif($a =='さようなら') {
	echo('aはさようなら');
} else {
	echo('aはあいさつではない');
}
?>
<?php print('<br>'); ?>
<?php print('｢〜の間ずっとwhile文｣'.'<br>'); ?>
<?php $i=0;
while($i<10){
	echo($i.'<br>');
	$i++;
	}
	?>
<?php print('<br>'.'繰り返す回数がわかっているときfor文'.'<br>');?>
<?php for($i=0; $i<10; $i++){
	echo($i.'<br>');
	}
	?>
  <?php print('<br>'.'配列に便利なforeach文'.'<br>');?>
<?php
$date = array('year'=>2012, 'month'=>8, 'day'=>01, 'hour'=>16, 'minute'=>10);
foreach($date as $val) {
	echo($val.'<br>');
}
?>
</body>
</html>

【phpの復習】

PHP

【phpの復習】

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>指定個数の画像を表示する</title>
</head>

<body>
<?php 
$num=5;

for($i=0; $i<$num; $i++)
{
	print("<img src=\"img/0.jpg\">\n");
	}
?>
</body>
</html>

理解しやすいように、画像も入れてみました。