JavaScript、PHP、MySQLを使ったり
2007年10月31日
いわゆる管理者。無制限状態。なんでも出来る
編集者。ダッシュボード、投稿、管理（アップロード使用可）、ブログロール、プロフィールが操作可能
投稿者。ダッシュボード、投稿、管理（アップロード使用可）、プロフィールが操作可能
寄稿者。ダッシュボード、投稿、管理（アップロード使用不可）、プロフィールが操作可能
購読者。ダッシュボードとプロフィールが操作可能
トラックバック URL :
コメント (0)2007年10月30日
overflow:autoを使うべし
overflow-yはIEの独自プロパティなのでボックスの高さを固定してもOperaなどではスクロールバーが出ない。
トラックバック URL :
コメント (0)2007年10月29日
2007年10月23日
このCSSはファイル名の通り、基本設定となる。
/********************************************************
* body
*/
body {
text-align: center;
}
#container {
width: 870px;
margin: 0 auto;
text-align: left;
background-color: #FFFFFF;
}
/********************************************************
* fundamental preferences
*/
* {
margin: 0;
padding: 0;
}
img {
border: none;
}
h3 {
clear: both;
}
/********************************************************
* class for layout
*/
.mb0em {
margin-bottom: 0px;
}
.mb05em {
margin-bottom: 0.5em;
}
.mb1em {
margin-bottom: 1em;
}
.mb2em {
margin-bottom: 2em;
}
.mb3em {
margin-bottom: 3em;
}
.ta-center {
text-align: center;
}
.ta-left {
text-align: left;
}
.ta-right {
text-align: right;
}
.fwb{
font-weight:bold;
}
.fs08em {
font-size: 0.8em;
}
このCSSファイルはファイル名の通り、活字づら（フォント）設定を定義したファイルである。フォントに関する設定はこにファイルで一元管理する。
※但し、下記はWindows用の設定（Macは入っているフォントが違うので異なった記述が必要となる）
@charset "UTF-8";/*CSSドキュメントの文字コードを記述（フォント名にはマルチバイト文字が含まれるため）*/
/********************************************************
* color, type face, line height
*/
h1,h2,h3,h4,h5,h6,p,dt,dd,table,address {
font-family: "メイリオ", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
line-height: 1.7;
color: #444444;
}
h2 {
font-size: 0.8em;
line-height: 1.2;
}
h3 {
font-size: 0.9em;
}
h4 {
font-size: 0.8em;
line-height: 1.2;
}
code {
font-family: "メイリオ", "ＭＳ ゴシック", "Osaka－等幅";
}
em {
font-weight: bold;
padding: 3px 3px;
}
address {
font-style: normal
}
p {
text-align: justify;
text-justify: inter-ideograph;
margin-bottom: 0.5em;
}
ul {
list-style-type: none;
}
li {
line-height: 1.2;
color: #666666;
}
/********************************************************
* font-size
*/
p,dt,dd,address {
font-size: 0.8em;
}
th,td {
font-size: 0.8em;
}
li {
font-size: 0.8em;
}
li li {
font-size: 1em;/*liが複数回入れ子になってる場合フォントサイズが小さくなってしまうのを防ぐ*/
}
正直macは良く分からん。
/********************************************************
* color, type face, line height
*/
h2,h3,h4,p,li,dt,dd,table,address {
font-family: "ヒラギノ角ゴ Pro W3", Helvetica, sans-serif;
}
code{
font-family: "Osaka－等幅";
}
このファイルでリンクの設定を一元管理する。注意しなくてはいけないのは、疑似クラスを指定する順序だ。これを間違うと上手く反映されないことがある。
但し、定番といえる記述は少なくサイトに合わせたデザインに下記を変更する。
/********************************************************
* link
*/
a:link {
color:#5aa5de;
text-decoration:underline;
}
a:visited {
color:#5aa5de;
text-decoration:underline;
}
a:active {
color:#f96400;
text-decoration:underline;
}
a:hover {
color:#f96400;
text-decoration:underline;
}
このファイルにはサイトごとに特色のあるソースコードが書きこまれる。
アウトローなIE6用のCSSを記述する。
CSSファイルを読み込むCSSファイルをを読み込む為のファイルである。
@importを使うとIE4には読み込まれないような処理となる。
@import "include2.css";
このCSSファイルはmac用以外を除く、上記CSSファイルを読み込む為のファイルである。
@import url(“/*ファイルのパス*/”);を使うとIE4.5には読み込まれないような処理となる。
@import url("base.css");
@import url("typeface.css");
@import url("link.css");
@import url("base.css");
以下のような順序で、HTMLファイルからCSSが読み込まれる。
<link href="css/part1.css" rel="stylesheet" type="text/css" media="all" /><!--外部CSSファイルの適用（NN4xをはじく）-->
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="css/ie6.css" />
<![endif]-->
<script type="text/javascript">
//macの場合はlinkタグが書き出される
if(navigator.userAgent.indexOf("Mac") >= 0){
document.write('<link href="css/mac.css" rel="stylesheet" type="text/css" media="all" />');
}
</script>
トラックバック URL :
コメント (0)2007年10月23日
トラックバック URL :
コメント (0)2007年10月23日
#menu {
position:fixed;
top:100px;
}
と記述すればブラウザの内枠上から100pxで表示される
但し、IE6では全く効果が無い
<!--[if lt IE 7.0]>
<style type="text/css">
body {
filter:expression('');
}
#menu {
position:expression('absolute');
top:expression(document.documentElement && document.documentElement.scrollTop || document.body && body.scrollTop || 0 + 0 + 'px');
}
</style>
<![endif]-->
とhead内へ追記する
document.documentElement && document.documentElement.scrollTop || document.body && body.scrollTopの部分は互換モードと標準モード時での違いを吸収するための記述であるIE6を捨てるというのも立派な選択肢の一つとして取っておく事を勧める。
なぜならばクロスブラウザ対策は思ったよりもコストがかかり、それに見合った効果が得られるとは必ずしも言えないからである。
トラックバック URL :
コメント (0)2007年10月22日
XMLHttpRequestを使って、他ドメインのサーバーと通信は出来ない。
どのようにすれば他サーバーからデーターを取得できるのか？
今回は2番を使う。
（スクリプト書き換え用）
<script type="text/javascript" charset="utf-8" id="import"></script>
（下記はテスト用でアラート）
function callBackFunction(JSON){
alert('test');
}
（下記はロード時に実行）
window.onload = function(){
var originalScriptNode = document.getElementById('import');
var newScriptNode = document.createElement('script');
newScriptNode.src = '/*ここにスクリプトのsrc属性値を記入（他ドメイン）*/';
newScriptNode.charset = 'utf-8';
newScriptNode.id = 'import';
originalScriptNode.parentNode.replaceChild(newScriptNode, originalScriptNode);
}
（→このデータを受け取った瞬間にcallBackFunctionが実行される）
callBackFunction(/*引数*/);
つまり、scriptタグのsrc属性には他ドメインも可能という特性を利用している
トラックバック URL :
コメント (0)2007年10月22日
よく出てくるサービス名や機器名。。。皆さんも読めないものが沢山ありますよね！？下記、参考にしてみてください～
訪問者の検索ワードを調べて、以下を追記しまっす！
トラックバック URL :
コメント (0)2007年10月20日
お絵かきすると、それが踊りだす。ブログにも貼れるらしい…
う～む。アイデアが面白いっすな！
wordpressでタグを貼り付けるときにタグに改行があると上手く貼れない時があるので注意…
トラックバック URL :
コメント (0)2007年10月19日
クリックするとIE7、IE6、Operaでは「5」、Firefox、Safari3、NS7.1では「7」と表示されます
functionをfunctionの中に書くことは可能だが、正式にはif文やwhile文などの文ブロック内で定義することは出来ず、functionの先頭に記述しなければならない。従って、以下のコードは厳密には不正確でありテスト自体も意味をなすものではない。
<head>
<script type="text/javascript">
window.onload = function(){
document.getElementById('2007101901button').onclick = function(){
var bool = true;
var num = 6;
if(bool){
function func(num){
num++;
return num;
}
num = func(num);
}
else{
function func(num){
num--;
return num;
}
num = func(num);
}
document.getElementById('2007101901num').value = num;
}
}
</script>
</head>
<body>
<form>
<input type="button" value="click" id="2007101901button" />
<input type="text" size="2" id="2007101901num" />
</form>
</body>
以下のように関数リテラルを使用する。
var func = function(num){
num--;
return num;
}
トラックバック URL :
コメント (0)
