Webプログラミングは,プロはもちろんアマチュアのプログラマの間でも,もはや欠かせない開発ジャンルの一つです。しかし,書籍や雑誌の解説記事のほとんどが,データベースがどうとか,サーバーサイドがどうとか,どうしてもディープな方向に進んでしまう傾向にあります。もちろん,それはそれで大切なことなんですが,いったい何割の人が,その技術を“自分の”ホームページに使っているでしょう。 最近話題の「リッチ・コンテンツ」にしても同様です。例えばFlash。たしかにActionScriptというスクリプト言語を使えば,動く,鳴る,つながると,いいこと尽くめです。でも,いかんせん「Macromedia Flash MX 2004を買ってきてね」とあっては,皆がみな使えるわけではありません。 Part1でも解説があったようにblog(ブログ)の認知度が上がり,利用率も増えて,プロバイダからの提供体制も整ってきて

これは新しい。 なんとあらゆるページをマトリックス風に表示してくれるのだ。(実際の動作はこちら) 実装するには以下の1行をコードに加えるだけ。 <script src="http://bodytag.org/bt_melter/bt_melter.js" type="text/javascript"></script> するとbodyタグの中身全部に適用される。 なお、javascript自体はbodytag.orgからダウンロードできる。 日本語にも対応しているようなので、サイトにアクセントを加えるちょっとした小細工として使えそうですね。

May 08, 2007 17,799 Comments Tags:Javascript If you are a bigMac fan, you will love thisCSS dock menu.It is using Jquery library and Fisheye component from Interface and some of my icons.It comes with two dock position:top and bottom. ThisCSS dock menu is perfect to add on to myiTheme. Here I will show you how to implementit to your web page.CSS dock menu screenshot Update: I no longer s
CSS ImageMaps -Flickr-likeTechnique? Below is a sample imagemap that's built entirely usingCSS and XHTML.CSSだけでイメージマップを作る有用サンプル。 画像の特定部分にカーソルを合わせると、説明を画像上に表示できるCSSとXHTMLサンプルが公開されていました。JavaScript を一切使っておらず、CSSだけで実現されているところがすごいですね。JavaScript が要らず、次のような綺麗なHTMLで実現できるところも嬉しいですね。 実装も簡単そうです。 <dl id="officeMap"> <dt id="monitor">1. Monitor</dt> <dd id="monitorDef"><a href="#"><span>Here's my 17" M
We’re getting things ready Loading your experience… This won’t take long.
Showing Hyperlink Cues withCSS (Ask theCSS Guy) I like the little icons next to hyperlinks that signify if that link will take me offsite, open a popup, or link to a file (as opposed to anotherhtml page). Here's how to doit in a way that's supported in IE7, Firefox, and Safari.CSSでPDFやExcel等のファイルタイプ別アイコンを自動付与する方法が紹介されていました。 自動付与、というのは、例えば、<a href="***.pdf">pdfファイル</a> のようなリンクがあったとすると、pdfという最後
Alexei@NitobiBlogArchive Development Diary: Taming the Fisheye I thoughtit might be agood idea to document the development of one of our components from a user-interface perspective. We’re in the process of developing a host of new components now, which should be ready for releaseearly this spring. One of these is a Fisheye Menu.JavaScriptでMacOS XのDock機能を実現する。 Dock機能というのは、次の画像のようにカーソルを合わせると画
Dynamic Ajax Tabs in 20Lines | 20bits The tabbed document interface is a common solution to the problem of presenting a user with multiple document in one window. 20行で実現できるAjaxタブインタフェース。 次のようなタブインタフェースをたったの20行で実現可能なようです。 次のようなDIV要素を定義します <div class="tabbed-pane"> <ol class="tabs"> <li><a href="#" class="active" id="pane1">Pane 1</a></li> <li><a href="#" id="pane2">Pane 2</a></li> </ol> </p> <div
CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」 2006年10月04日- FreeStyle Menus Demonstration This script is a highly flexible means of convertingHTML content into powerful popup menus, using either nested lists or DIV tags for menu data, and following best practiceguidelines for powerful and accessible menus.CSSとJavaScriptでアニメーションがカッコいいメニューを実装「FreeStyle Menus」。 ブラウザ上で動くWindowsのメニュー風のUIは結構見かけ
FirefoxにGUIプロトタイピングの機能を追加するものすごい拡張「The Pencil... 次の記事 ≫:インターネット越しにWiiリモコンを操作できる「Wiimote-over-HTTP」 Dynamic Drive DHTML Scripts-Simple Tree Menu This is a unobtrusive Tree Menu script that turns any ordinary list (UL element) into a collapsible tree!JavaScriptを使ったULリストをツリー風に表示するサンプル「Simple Tree Menu」。 次のようなHTMLがあったとすると、 <ul id="treemenu2" class="treeview"> <li>Item 1</li> <li>Folder 1 <ul> <li>Su
これはすごい。あらゆるページに拡大鏡を設置できるJavascriptです。 ↑ こんな感じに拡大鏡を設置可能。 画像と簡単なスクリプトをインストールすればOKなようです。 追加するコードは以下のとおり。 まずはページのヘッド部分に以下を追加。 <script type="text/javascript" src="loupe.js"></script> そして拡大鏡を追加したい画像にonLoadで以下を追加。 <div> <img id="..." onLoad="initLoupe(this.id);" src="..." width="356" height="205" alt="..."> </div> 細かい写真などを見せたい場合に便利ですね。知っておくとよさそうです。 ダウンロードや詳しい使い方は以下をご覧ください。 » Loupe.js

FlashとAjaxを使った使いやすいファイルアップロードライブラリ「FancyUpl... 次の記事 ≫:16x16ピクセルの芸術的favicon集 Instant.js Instant.js 1.0 allows you to add an instant picture effect (including tilt) to images on your webpages. 画像に簡単にポラロイド風エフェクトをかけられるJavaScriptライブラリ「Instant.js」 次のように、画像をポラロイド風にすることが出来ます。使い方も簡単で、画像の class 属性に定められたclass名を付けるだけ。 使い方は、まず、<script type="text/javascript" src="instant.js"></script> でinstant.js を読み込んで、 画像にcl
また冷やし豆乳坦々麺 今年になって2度目の冷やし豆乳坦々麺です。 ピリ辛の肉味噌と少し甘めの練りごまたっぷりの豆乳スープが美味しくて、自分が作ったものなのに美味しい!を連発してしまいます。 先回は絵的にあまり美味しそうに見えなかったので、今回は白髪ネギ以外に茹でた青梗菜と半…

前回の連載では、Ajaxアプリケーションの開発を支援するJavaScriptライブラリを紹介し、Prototypeとscript.aculo.usを使用して実例を詳しく解説したが、JavaScriptライブラリに関するその後の状況について、今回の内容に入る前に補足しておこう。 現状で最もポピュラーなライブラリとなりつつあるPrototypeとscript.aculo.usについては国内での注目も高く、日本語で読める詳細資料や新機能の紹介などが活発だ。以下のサイトは網羅的で資料性も高く、Prototypeやscript.aculo.usで開発を始めるには非常に参考になる。 prototype.js v1.3.1の使い方 prototype.js v1.3.1の非公式マニュアル&リファレンス Usin prototype.js v1.3.1の邦訳版(なお、元サイトは現在は1.4.0の解説にバー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く