Ajax/CSS/PHP等のチュートリアルまとめ:phpspot開発日誌
Tutorials Round-Up: Ajax, CSS, PHP and More | Smashing Magazine Ajax/CSS/PHP等のチュートリアルまとめが公開されてます。 英文のサイトは本当にチュートリアルが充実していますね。 Ajax AJAX Desktop Tutorial AJAX Matters Blog Ajax RSS reader AJAX Tutorial Ajax: What is it Good For? → 続きを読む CSS Advanced CSS Layouts: Step by Step Beginner’s guide from a seasoned CSS designer CSS Advanced Guide CSS and HTML examples and tutorials by Ove Klykken CSS Basic
IT戦記 - CSS の勉強会をしました
2007 CSS Study Meeting http://artcode.g.hatena.ne.jp/keyword/2007%20CSS%20Study%20Meeting 発表をしましたので資料を置いておきます。 http://usrb.in/amachang/static/cssstudy/200701/ Firefox で動きます。IE でもぎりぎりうごきます。あ、でも、横長な表示域じゃないと崩れる可能性大です。 左右キーで操作してください。また、ソースは実行できるようになってるので、実際に実行しながら読んでいっていただけるとうれしいです。 他に事前に CSS のセレクタのバグリストとプロパティ一覧を作りました。 プロパティ一覧は element.style に辞書アタックを掛けて各種ブラウザから抽出したプロパティです。 http://usrb.in/amachang/stat
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」:phpspot開発日誌
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」 2006年10月22日- Tooltip for forms You can download the entire script from this Zip file フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」。 このライブラリを利用すれば、次の画像のようなツールヒントをフォーム上に出すことが可能です。 実装は、必要なライブラリを読み込んだ後、次のように、tooltipText 属性にヒントを書きます。 <input type="text" id="firstname" name="firstname" tooltipText="Type in your firstname in this box"> そして、
Tam-calendar.js « iDeasilo
矢印をクリックすると前/翌月のカレンダーに切り替わるようにする 左上と右上に矢印が表示されますが、デフォルトではこれらをクリックしても何も起こりません(まだ怒らないで!)。Tam-calendar.js はカスタマイズの自由度をできるだけ高めることを大切に考えて作られていますが、ここで Tam-calendar.js 全体を通して貫かれているカスタマイズの作法について紹介したいと思います。 まずは、左上の矢印をクリックしたら前月のカレンダーが表示されるようにすることを例に見ていきましょう。 Tam-calendar.js においては、左上の矢印はただの td 要素のひとつに過ぎず、特別な扱いはされません。ただしその class 属性には nav と previous という値がセットされているはずです。まず手始めに DOM Element オブジェクトとしてのこの td 要素を、クラスの組
ウィンドウサイズに応じてレイアウトを調整するJavaScriptライブラリ「Dynamiclayout.js」:phpspot開発日誌
ウィンドウサイズに応じてレイアウトを調整するJavaScriptライブラリ「Dynamiclayout.js」 2006年12月27日- Particletree Dynamic Resolution Dependent Layouts ウィンドウサイズに応じてレイアウトを調整するJavaScriptライブラリ「Dynamiclayout.js」。 読み込んでおくだけで、750px以下、750px以上/950px以下、950px以上の３つのウィンドウサイズに応じて自動でCSSを切り替えることが出来ます。 JavaScriptの知識が一切なくとも、利用者の端末に合わせて、最適なUIを選択することができ、なかなか面白い＆便利。 アイデア次第で凄く優れたWEBサイトになりそうな感じですね。 (750px 以下) (750px以上/950px以下) (950px以上) 関連エントリ AjaxでSS
角丸に関するあれこれ
最近、というか Web2.0 的デザインなんてものが言われ始めてからというもの、「角丸」 ってやつがとっても人気ですね。(X)HTML、CSS 関連の話題でもよく取り上げられています。 ということで、角丸の作り方をいくつかの種類別に、また、数値などを入力するだけで、角丸のソースを生成してくれる角丸ジェネレータなどをいくつかまとめてみました。 角丸の作り方その1、画像を使う方法 ソースがどうこうとか、まったく気にしないで塗りつぶしの角丸ボックスを作るだけなら、4つの角に配置する画像を用意した上で、下記のような感じにすれば得に難しくもなく角丸完成と。しかもフレキシブル。しかしソース汚い。 <!--HTML--> <div class="left-top"> <div class="right-top"> <div class="left-bottom"> <div class="right-b
Online Generators | Developer's Toolbox | Smashing Magazine
Responsive design is a default these days, but we are all still figuring out just the right process and techniques to better craft responsive websites. That’s why we created a new book — to gather practical techniques and strategies from people who have learned how to get things done right, in actual projects with actual real-world challenges. Neatly packed in a gorgeous hardcover, the book featur
単体で使えるJavaScriptカラーピッカー「DHTML Color Picker」:phpspot開発日誌
ColorJack: DHTML Color Picker ColorJack Plugin’s main advantages are it’s simplicity. To give you an idea, let’s compare it to a similar (more popular) product named “ColourMod”… the javascript alone is 475% more bloated than ColorJack’s code. 単体で使えるJavaScriptカラーピッカー「DHTML Color Picker」。 prototype.js等の他ライブラリに依存しないので、単体で使えて軽いカラーピッカー用ライブラリとして使えそう。 関連エントリ
Opera News
Mindfulness, Opera Air Opera Air partners with the Oxford Mindfulness Foundation August 1st, 2025 Hey all, Today we’re thrilled to announce a partnership between Opera Air and the Oxford Mindfulness Foundation, an internationally recognized... AI Opera’s vision: agentic browsers will tackle web inefficiency and unlock massive productivity gains July 31st, 2025 Agentic AI Browsers are here to compl
英単語をダブルクリックで英英辞典を検索するBookmarkletとユーザースタイルシート : しげふみメモ
2006年11月12日22:42 カテゴリ英語Mozilla 英単語をダブルクリックで英英辞典を検索するBookmarkletとユーザースタイルシート IT戦記 - 英単語をダブルクリックで英英辞典を検索する Bookmarklet と Greasemonkey という記事のブックマークレットを試してみました。 このブックマークレットを実行し、そのページ内の英単語をダブルクリックすると自動で英英辞典を検索してくれます。 英単語を調べるのに英英辞典を使うのは、英語の上達にはいいらしいですね。 これはダブルクリックするだけというのが便利で、これから使っていこうと思いますが、自分向けに少しブックマークレットを変更しました。 また、検索結果のCambridge Dictionaries Online のページにユーザースタイルシートを当てて、余分なものを表示しないようにしてみました。 検索結果は別
Scott Jehl, Designer/Developer, Boston, MA | Process: StyleMap: Visual Sitemap
StyleMap: HTML Visual Sitemap Tool Update! I've released a new version of this technique that has more simplified markup structure and better browser support. Please read Stylemap v2 HTML visual sitemap. If you've ever had to produce a sitemap for a client using tools like Visio or OmniGraffle, you know that it can be tedious to visually organize a complex hierarchy of pages. Having experienced th
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＆CSSで独自デザインのselectボックスを作成:phpspot開発日誌
Script.aculo.us Select Box This javascript class allows you to add nice styled select boxes in a HTML page. JavaScript＆CSSで独自デザインのselectボックスを作成。 チェックボックスとかラジオボタンの独自デザイン仕様にする方法はいろいろあったものの、selectボックスの独自デザイン仕様にする方法はそういえば無かったですね。 prototype.js ベースで script.aculo.us を使い、次のイメージのようなselectボックスを作るライブラリが公開されています。 選択項目の内容はAjaxで取得できるようです。 レスポンスが遅い点と挙動が通常のselect ボックスと違う点で操作に違和感がありますが、多少の修正で通常のselectボックスと同様に出来そうな
CSSとJavaScriptで影付きの角丸ボックス要素を作る:phpspot開発日誌
Transparent custom corners and borders, version 2 | 456 Berea Street It’s been almost a year and a half since I posted Transparent custom corners and borders, a technique for creating custom corners and borders with optional alpha transparency. CSSとJavaScriptで影付きの角丸ボックス要素を作る。 次のような２重線と影がついたボックスのサンプルが公開されています。 HTMLは次のようにシンプルな形に出来るようです。 <div class="cbb"> <h1>Transparent custom corners and borders, v
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://youmos.com/reference/set_element_class.html
http://youmos.com/reference/cssjavascriptmin-width_max-wid.html
http://www.createworkspace.com/
caramel*vanilla » Blog Archive » WordPressでLightboxを超簡単に使ってみる
WebOS Goodies は移転しました
http://www.dxdec.com/wod/formstyle/index.html