DIVを垂直方向に中央寄せするCSSサンプル:phpspot開発日誌
Blue Box Demo: Vertical Centering with a Shiv Div DIVを垂直方向に中央寄せするCSSサンプル。 次のように、DIV要素をブラウザの縦方向に配置できます。 CSSは非常にシンプルで、まず、html と body 要素に height:100% プロパティを設定します。 次に、body内にdiv要素を配置し、そのdiv要素に対し、height:50% かつ、margin-top:-50px のようにプロパティをあて、 中央寄せしたい要素(上図中、青い部分)の半分のサイズ分のマージンをマイナスします。 最後に中央寄せしたいdiv要素( height:100px ) を配置することで、青い部分は中央によります。 垂直方向に、100px のdiv要素が配置される感じです。 <html> <head> <style type="text/css">
IFRAMEを使わずにHTMLファイルから他のHTMLファイルを読み込む方法:phpspot開発日誌
Insert HTML page into another HTML page | published @ aplus moments IFRAMEを使わずにHTMLファイルから他のHTMLファイルを読み込む方法。 Objectタグで外部ファイルを読み込む方法があるんですね。 <html> <head> <title>test</title> </head> <body> <!--[if IE]> <object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="/exec/some.html" style="width:100;height:100px"> <p>non object</p> </object> <![endif]--> <!--[if !IE]> <--> <object type="text/html
Ajax,Apache,CSS,CVS,HTML,JS,Perl,PHP等のチートシートまとめ:phpspot開発日誌
Smashing Magazine Blog Archive Cheat Sheet Round-Up: Ajax, CSS, LaTeX, Ruby… Ajax,Apache,CSS,CVS,HTML,JS,Perl,PHP等のチートシートまとめが紹介されてます。 チートシートって印刷して貼っておくとほんとに便利でお世話になってます。 Ajax関連 What’s Ajax? Cheat Sheet - PDF Prototype Dissected - Cheat Sheet PNG scriptaculous Combination Effects - Cheat Sheet - PDF Apache関連 Apache Cheat Sheet Apache 1.3 Quick Reference Card - free quick reference cards - PDF htacc
JavaScriptでOSやブラウザの検出が出来る「BrowserDetect.js」:phpspot開発日誌
JavaScript - Browser detect A useful but often overrated JavaScript function is the browser detect. Sometimes you want to give specific instructions or load a new page in case the viewer uses, for instance, Safari. JavaScriptでOSやブラウザの検出が出来る「BrowserDetect.js」。 JavaScriptでOSやブラウザのバージョンを簡単に得ることができます。クラスなのでグローバル変数多用もせず、再利用できて便利です。 <html> <body> <script language="javascript" src="BrowserDetect.js"></sc
各言語用Ajax関連ライブラリ＆Ajaxフレームワークのコンプリートリスト:phpspot開発日誌
Software Development in the Real World: The Complete List of Ajax Tools Ajax has really taken off over the last two years. Ajax is really just the combination of Asynchronous JavaScript and XML. 各言語用Ajax関連ライブラリ＆Ajaxフレームワークのコンプリートリスト。 PHP, Perl, .NET, ColdFusion, Flash, Java用の他、Ajaxフレームワークのリストが公開されていました。 AJAX ライブラリ Yahoo Ajax Libraries - ご存知Yahoo UI Library Google Ajax Search Yahoo Maps Ajax API -
Ajaxチュートリアル集126個:phpspot開発日誌
AsH: Top 126 Ajax Tutorials Ajaxチュートリアル集126個。 Ajaxの入門、ブックマークレット、チャット、ドラッグ＆ドロップ、動的コンテンツ読み込み、オートコンプリート、ファイルアップロード Lightbox風画像表示、キーワードサジェスト、インクリメンタルサーチ、プログレスバー、角丸、リストのソート、ツリー、投票など、ありとあらゆるチュートリアルがまとまっていて、やりたいことを実現する際に使えそうです。 これだけのリファレンスがあるんですね。驚きです。 関連エントリ ドラッグ＆ドロップが簡単に出来るJavaScriptライブラリまとめ WEB開発者のためのリソースを集めたリンク集 JavaScriptデバッグツール集 JavaScriptでマウスホイールイベントを扱い、スクロールも停止する方法 高速＆シンプルなJavascriptテンプレートシステム『RN
CSSでクールなタブUIを作成するサンプル:phpspot開発日誌
OSResources - How to create CSS overlapping tabs? Sometimes simulating a real desktop interface for your web application can be a real challenge, especially when dealing with tabs. CSSでクールなタブUIを作成するサンプル。 次のようなタブUIを作ることが出来ます。 サンプルのCSSを定義しておけば、後は次のようにシンプルなHTMLをコーディングするだけで上記画像のようなタブUIが作れます。 HTMLもクリーン。 <ul class="obtabs"> <li class="first"><span><a href="#">Jack</a></span></li> <li><span><a class="new
CSSの小技集、20個:phpspot開発日誌
CSS Techniques Roundup - 20 CSS Tips and Tricks I never cease to be amazed at what problems can be solved with pure CSS. CSSの小技集、20個。 どのテクニックも、誰もが使うであろうテクニックで便利なものばかりです。 角丸 画像なしの角丸 投票用スターの作成 テーブルなしのフォーム リストをＣＳＳでデザイン 2カラムレイアウト 3ラムレイアウト 3カラム固定幅、中央寄せ 印刷とＣＳＳ RSSフィードにスタイルシートを指定 固定フッター 要素にHoverエフェクトを加える HRタグへのCSS ＦｌｏａｔのClearに関するテクニック CSSでポップアップ小窓 ボックスの見出し(Box Punch)を表現 CSSボタン オレンジのRSSボタンをP
10,000種類以上のフリーフォントを試してダウンロードできる「better fonts」:phpspot開発日誌
Better fonts - over 10,000 fonts for free 10,000種類以上のフリーフォントを試してダウンロードできる「better fonts」。 左カラムにサンプルのフォントが多数表示されていて、クリックすると、そのフォントで描画された文字サンプルが右カラムに表示されます。 簡単にプレビューをみれるので、サイトデザイン時などに、デザインに合った理想のフォントを探すのに便利そうです。 独自に入力したテキストを元にフォントを描画することもできます。 次のようにJavaScriptの入力ボックスが現れるので入力してOKボタンを押します。 ↓ その場ですぐ表示可能。 ダウンロードのその画面内、「Download Font!」ボタンでダウンロード可能です。 これは便利ですね。 関連エントリ オンラインでフォント表示テストを行える『Font Tester』
CSSだけでフレームを作るテクニック:phpspot開発日誌
CSS Frames v2, full-height | 456 Berea Street Way back in August of 2003 I wrote a short article called CSS Frames, in which I described a technique to emulate the visual appearance of HTML frames with CSS. CSSだけでフレームを作るテクニック。 通常、フレームというとframeタグを使って実現しますが、検索クローラーに対して不利などの理由から最近ではあまり見かけなくなってしまいました。 フレーム風のインタフェースをＣＳＳだけで実現するテクニック。 常にヘッダー、フッターのナビゲーションが固定されているのでフレームの使いやすさはそのままで、かつクリーンなHTMLによってフレームを実現でき
サイト移転時の301リダイレクト処理の具体例:phpspot開発日誌
Steven Hargrove: How to redirect a web page, the smart way サイト移転時の方法として、301リダイレクトにより、新しいサイトへの転送が最適な方法とされていますが、その301リダイレクト処理の各種具体例。 .htaccess で301リダイレクトを行う方法 特定ページのみの場合は次のようにします。 redirect 301 /old/old.html http://www.yahoo.co.jp 上記は、/old/old.html にアクセスした場合、www.yahoo.co.jp に301リダイレクトされます。 サイトのドメイン移転をした場合は次のように記述します。 RewriteEngine On RewriteCond %{http_host} ^www.from-url.com RewriteRule ^(.*) http:/
超クールな映画SinCity風の画像を作るPhotoShopチュートリアル: phpspot開発日誌
Sin City Style - Tutorial Seeker 映画、Sin City風の画像を作るPhotoShopのチュートリアルがあったので試してみることにしました。 次のようにSinCity風に画像に加工を加えてみます。 1) まず「イメージ→色調補正→レベル補正」によって、画像のコントラストを上げます。 ※レベル補正の説明 2) 「フィルタ→アーティスティック→カットアウト」で画像の輪郭を大まかにします。 ・レベル数は２、エッジの単純さ３、エッジの正確さ２、でカットアウト適用 3) 次に雨を降らせるエフェクトを付けるために、画像を作成します。 ・新規レイヤーを作成し、５０％グレーで塗りつぶし ・「フィルタ→ノイズ→ノイズを加える」で量を400%(最大)にしてノイズを加えるでノイズを付けます ・「フィルタ→ぼかし→移動」で「角度90°距離999px」を選択して実行します。 ・これ
Web開発者のためのライブラリTOP10とCrossBrowserToys:phpspot開発日誌
Top 10 Web Developer Libraries - Cameron Olthuis I decided to make a list of the top libraries that I have come across or that I personally use. WebデベロッパーのためのライブラリTOP10。 Moo.fx , Rico , Swat ,ColorCombos ,script.aculo.us ,Mochikit ,Dynamic Drive CSS Library, PEAR , DHTML Goodies ,Cross Browser | Toys ,Yahoo UI Library 実際には12個紹介されます。 ColorCombos, Cross Browser | Toys 以外はわりとメジャーなので知っていましたが、いろいろとライブラ
PHPコードをEXEに変換してスタンドアロンアプリにする方法:phpspot開発日誌
Bambalam PHP EXE Compiler/Embedder 1.0 - Free php to exe converter! Bambalam PHP EXE Compiler/Embedder is a free command line tool to convert PHP applications to standalone Windows .exe applications. PHPコードをEXEに変換してスタンドアロンアプリにするツール、Bambalam PHP Exe Compilerの紹介。 PHP4.4.2で動くPHPコードならEXEに変換できます(PHP5は将来対応予定)。 作成されたEXEはDLLが不要で、スタンドアロンアプリとして動作します。 コンパイルされるものは、Truck MMCacheを使ってソースコードをEncode & Optimizeしてるみ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
