2007年08月29日

特定要素に包含要素を追加する

タグをタグで囲みたいというわけです続きを読む
posted by ねこまんま at 14:58
Comment(0) | TrackBack(0) | JavaScript

2007年08月06日

prototypeのobjectオブジェクト汚染

prototype.jsがobjectオブジェクトを拡張している為for inでオブジェクトを回せなくなる

続きを読む
posted by ねこまんま at 16:18
Comment(0) | TrackBack(0) | JavaScript

styleを取得

getComputedStyleでスタイルが取得できます。続きを読む
posted by ねこまんま at 16:14
Comment(0) | TrackBack(0) | JavaScript

2007年07月24日

RegExpで正規表現

javascriptで正規表現にオブジェクトを参照する際にはRegExpでオブジェクト化する必要がある。続きを読む
posted by ねこまんま at 22:42
Comment(0) | TrackBack(0) | JavaScript

配列をソート

sortメソッドだと文字列でソートをしてしまうので整数型でソートする方法続きを読む
posted by ねこまんま at 22:36
Comment(0) | TrackBack(0) | JavaScript

2007年07月02日

functionにthisを指定できる

applyを使う。続きを読む
posted by ねこまんま at 15:57
Comment(0) | TrackBack(0) | JavaScript

onloadイベントでonclickイベントを追加する方法

onloadイベントでonclickイベントを追加する方法続きを読む
posted by ねこまんま at 15:45
Comment(0) | TrackBack(0) | JavaScript

2007年06月23日

現在実行されているイベントの情報を取得

現在実行されているイベントの情報を取得続きを読む
posted by ねこまんま at 11:18
Comment(0) | TrackBack(0) | JavaScript

2007年06月18日

クロージャ

よくわからないがクロージャはこんな感じらしい。
続きを読む
posted by ねこまんま at 11:33
Comment(0) | TrackBack(0) | JavaScript

2007年06月05日

クロスブラウザなfirstChild

ブラウザにより改行をnodeと解釈したりしなかったりと仕様がまちまちなので、firstChildなんかはかなり使いにくい。そこでクロスブラウザなfirstChildの記述方法続きを読む
posted by ねこまんま at 11:33
Comment(0) | TrackBack(0) | JavaScript

2007年05月22日

Prototype.js news scroller

Prototype.js news scrollerが公開されてたのでPrototypeLessにしてみた。続きを読む
posted by ねこまんま at 21:24
Comment(0) | TrackBack(0) | JavaScript

2007年05月19日

文字列.toLowerCase()

posted by ねこまんま at 15:25
Comment(0) | TrackBack(0) | JavaScript

2007年04月30日

slice

変数.slice(開始位置,終了位置)

負の値の場合、末尾から数える。続きを読む
posted by ねこまんま at 21:34
Comment(0) | TrackBack(0) | JavaScript

2007年04月18日

setInterval

変数(省略可) = setInterval(関数名,ミリ秒)で関数を実行し続ける

setIntervalの続きを読む
posted by ねこまんま at 15:19
Comment(0) | TrackBack(0) | JavaScript

2006年06月15日

文字コードの指定

script要素のcharset属性でsrc属性で参照しているページの文字コードを指定できます。
posted by ねこまんま at 13:15
Comment(0) | TrackBack(0) | JavaScript

2006年04月07日

javascriptとcssで角丸を表現する方法

webサイト作成の際に手間になってくる角丸での表現ですが
画像を使わずにCSSのみで表現する方法があります。

<div style="background:red;color:white;width:200px;">
<div style="background:white">
<div style="background:red;margin: 0 5px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 3px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 2px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 1px;height:2px;overflow: hidden;">
</div>
</div>
<p style="padding:2px;">
本文本文本文本文本文本文本文本文本文本文<br />
本文本文本文本文本文本文本文本文本文本文
</p>
<div style="background:white">
<div style="background:red;margin: 0 5px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 3px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 2px;height:1px;overflow: hidden;">
</div>
<div style="background:red;margin: 0 1px;height:2px;overflow: hidden;">
</div>
</div>
</div>
2006/4/8 IEで正しく表示されないバグを修正(赤字が修正部分)


Browser View

本文本文本文本文本文本文本文本文本文本文
本文本文本文本文本文本文本文本文本文本文




でもこれだけでは芸がありません。
javascriptを使ってソースの中に余分なタグを極力書かないようにして
CSSで角丸を表現する方法がNifty Cornersで公開されています。

//角丸を付けたいdiv
<div id="nifty">
<p>
本文本文本文本文本文本文本文本文本文本文<br />
本文本文本文本文本文本文本文本文本文本文
<p>
</div>

//追加するjavascript
<script type="text/javascript" src="nifty.js"></script>
<script type="text/javascript">
Rounded("div#nifty","red","whte"); //Rounded(要素名, 背景色, 前景色)
</script>

//追加するCSS
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px}


つまりjavascriptファイルやcssファイルを外部化している場合
ソースコードのdivにidを付けるだけで角丸が実現できます。

すごく便利です。
是非普、及してほしいものです。

posted by ねこまんま at 01:19
Comment(6) | TrackBack(1) | JavaScript

2005年11月23日

try 〜 catch

例外が発生したときにそれを捕まえて処理することができます。
var x = 0;
try {
alert(x.x.x);
}
catch(e) {
alert(e.number & 0xffff); //5007
alert(e.description); //'x.x'はオブジェクトではありません。
}
本来は alert(x.x.x); のところで 『'x.x'はオブジェクトではありません。』 といったエラーメッセージが出てそこでプログラムが止まってしまいますが、 try 〜 catch を使うと try {…} の中でエラーが出た場合、 catch に飛びます。 エラーが出なかった場合は catch 以下は無視されます。
catch の引数はエラーオブジェクトで、 エラーの内容を表しています。
number プロパティはエラーナンバーを表していて、 エラーの種類を識別できます。 description プロパティはエラーメッセージです。
エラーオブジェクトは次のように作成できます。

e = new Error(number, description);
posted by ねこまんま at 23:38
Comment(0) | TrackBack(0) | JavaScript

2005年08月30日

window.onloadについて

window.onloadは一ページで一度しか使用できません。

2回以上使用した場合最初に使用した物について認識されません。
(ちなみにエラーも出ません)

これで3時間悩んだorz

トリップスウェブ初めて気づく安定した格安レンタルサーバー
人気のWEBクリエイターblogはここ

posted by ねこまんま at 01:26
Comment(0) | TrackBack(0) | JavaScript

2005年08月06日

空欄チェック

javascript入力フォームなどにある空欄チェックです。
【スクリプト部分】
function FormCheck(){
 with (document.form1){
  if(text.value==''){
   alert('フォームが入力されておりません');
   text.focus();
   return false;
  }
 }
}


【html部分】
<form name="form1" action="next.page" method="POST" onSubmit='return FormCheck();'>
<input type="text" name="text"><br>
<inut type="submit" value="送信">
</form>


これは結構ユーザビリティを考慮したチェックなんで是非お試しあれ

レンタルサーバのプレミアエクスビット、大容量・高品質の500メガ1995円。サポート第一主義のレンタルサーバーです。

人気のWEBクリエイターblogはここ
posted by ねこまんま at 01:34
Comment(0) | TrackBack(0) | JavaScript

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。