[B! サンプル] reponのブックマーク

Youtubeの動画を背景に

Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest techno logies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp

repon 2012/12/10

リンク

CSSスプライトで画像を円滑に表示させる

CSSスプライトで画像を円滑に表示させるCSSスプライトとは、複数の画像をひとつにまとめて、CSSでポジションを指定することにより表示させるCSSの技のひとつです。画像の数を減らすことにより、サイトの表示を速めることができます。以前よりYoutubeなどに使用されているので、その名前を一度は聞いたことがあるかもしれません。ここではCSSスプライトを使用したメニュー画像の作り方を紹介します。 CSS スプライトを使うデメリットメリットは上記にあるとおり、サイトの高速化が期待できます。ではデメリットとは？ alt 属性が使えない背景画像のリピート表示ができない更新する時に手間がかかる（サイズを変えると CSS も変えなければいけないため）以上をふまえて、私はいつもメニューの背景やボタンなど、マウスオーバー時に変化する画像のみ CSS スプライトを使用しています。ということで、早速作ってみましょ

repon 2012/07/21

リンク

RubyでProxyサーバ経由でのOpenIDアクセス - ある異邦人の技術メモ

OpenID学習中である。（なかなか時間が取れずにはかどらない・・）先日ruby-openidのサンプルを立ち上げて動かしてみたところだが、１点問題にぶち当たっていた。会社(Firewallの中でHTTPアクセスはプロキシ経由が前提)の中に立ち上げたOpenIDサンプル実装(OP,RP実装を含む）を使って色々遊ぼうと思ったのだが、さっぱり遊べないというべきだろうか。そんな問題である。あまりにつまらないので、自宅サーバを登場させてそちらにサンプル実装を乗っけたところちゃんと遊べたので、設定ミスではないらしい。 OpenIDってリダイレクトでブラウザを介してポンポン飛ぶだけだから中と外を意識しなくても使えるのかなぁなんて思っていたのだが、そうじゃないらしいということだ。会社の中と外をまたがるOpenIDの使い方として２つ考えられる。即ち社内のＯＰ、オープンなＲＰ社内のＲＰ、オ

repon 2012/07/14

リンク

JavaScriptを使ったULリストをツリー風に表示するサンプル「Simple Tree Menu」:phpspot開発日誌

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>It em 1</li> <li>Folder 1 <ul> <li>Su

repon 2011/11/02

リンク

jQuery 開発者向けメモ - 基本・サンプル

基本 jQueryとは jQuery は様々な処理を短く簡単に書ける JavaScript ライブラリです．独自のXPATH/CSSセレクタを利用することで，多くのDOM操作を非常に簡単に書くことが出来ます． JavaScriptのDOM操作や，XMLHTTPRequest，XMLの操作などを覚えなくとも， Ajaxを利用したインタラクティブなページを作ることが出来ます．以下のサンプルを見れば，JavaScriptらしい表記をほとんどする必要がないことがわかると思います． toggleサンプル特定のブロックの表示・非表示を切り替えるのは以下のようなコードになります． $("#target_toggle").toggle("slow"); このブロックは，<p id="target_toggle"> です． Ajaxサンプル Ajaxでhello.htmlをロードするのは以下のようなコ

repon 2011/10/23

リンク

OpenIDで認証するCGIのサンプル - うなの日記

OpenIDで認証するCGIのサンプルです。taslamの日記 - 認証APIいろいろをRubyで使うを参考に(というかほとんどコピペですが)作成させて頂きました。 OpenIDとは? @IT - OpenIDの仕様と技術を参照。 OpenIDでの認証の流れサービス「Hoge」の利用をOpenIDで認証を受けたユーザーに許可する場合の流れは次のようになります。なお、認証には、はてなのOpenID認証機能を使うものとします。 1.認証者がIDを示すURL(Claimed Identifier)をサービス「Hoge」(Consumer)に提示します。 OpenIDのIDはURLです。はてなの場合「http://www.hatena.ne.jp/<ユーザーID>/」が該当します。以下のサンプルでは、初回アクセス時にIDを入力するフォームを表示して、指定してもらうようにしています。 2.サービ