色々使えそうな、かっこよくアニメーションするスライダー実装JSライブラリ:phpspot開発日誌
Ultra versatile slider for websites 色々使えそうな、かっこよくアニメーションするスライダー実装JSライブラリ。 ウィジェット風に設置できそうなJSライブラリが紹介されています。 デモページ 次のように、divで大きく囲って中身にリストを定義して、リスト内をスライドさせるという、他の多くのライブラリで同じように実装されているようになっていて使いやすい。 <div id="slider-stage"> <ul id="myList"> <li >Box 1</li> <li >Box 2</li> <li >Box 3</li> <li >Box 4</li> <li >Box 5</li> <li >Box 6</li> </ul> </div> 次へ、前へリンクも<a>タグにidをふるだけみたいです。 <div id="slider-buttons">
WEBデザイナー必見！あらゆるリソースが参照できる「Web design tools and resources」
TOP > WebDesign > WEBデザイナー必見！あらゆるリソースが参照できる「Web design tools and resources」 Deisngdevelopではデザイン、WEBに役立つ様々なコンテンツを日替わりで紹介していますが、今回紹介する「Web design tools and resources」はあらゆるWEBデザインに役立つリソースがまとめられているエントリーです。 リソースはリソースはJavascript、Miscellaneous Tools、Hosting、Grid Design、Typographyなどとジャンル分けされ、一覧になっていて非常に分かりやすくまとめらられています。 詳しくは以下 タイトル横に属性が付けられています。 さらに嬉しい事にサイトへのリンクだけではなく、簡単な説明とそのリンク先でDownloadができるのか、サンプルが
[JS]これ最強かものツールチップスクリプト -BeautyTips
シンプルなツールチップも簡単に実装できるだけなく、デザインのカスタマイズが可能で、対応トリガーも豊富なツールチップのスクリプト「BeautyTips」を紹介します。 BeautyTips demo BeautyTipsは機能が豊富というだけでなく、テキストや画像、AJAXコンテンツの表示、ツールチップの表示位置の自動補正など基本性能もしっかりと抑えられており、フォームエレメントへの表示、ツールチップ元の変更なども可能です。 ツールチップはcanvasで描かれており、画像は必要ありません。 対応ブラウザはIE6.x+, Fx3.x, Op8+, Safari3.xとのことで、canvas非対応ブラウザにはExplorerCanvasが使用されています。また、IE6のz-indexへの対応にbgiframe、ホバー処理にhoverIntentが使用されています。 ※Chrome 1, Fx2で
リッチで使いやすいＵＩを作成するためのjQueryライブラリ＆サンプル集:phpspot開発日誌
45 New jQuery Techniques For Good User Experience | Developer's Toolbox | Smashing Magazine リッチで使いやすいＵＩを作成するためのjQueryライブラリ＆サンプル集。 JSフレームワークはもうjQueryの時代だと言わんばかりの豊富かつ有用なサンプルが多数掲載されています。 Build A Login Form With jQuery Spoiler Revealer with jQuery AJAX Upload FCBKcomplete Create Accessible Charts Using Canvas and jQuery Radio Button and Check Box Replacement Submit a Form without a Page Refresh jQuery
2008年に注目を集めた使えるJavaScriptライブラリ集:phpspot開発日誌
Best of 2008 - JavaScript | Design Shack 2008年に注目を集めた使えるJavaScriptライブラリ集が紹介されていました。 どれも非常に便利でサイト構築に役立ってくれるでしょう。 sIFR Lite Javascriptでテキスト文字列を綺麗な画像にしてくれるライブラリ。 画像部分にはFlashを採用している。検索クローラーフレンドリ。 <h3>How is this different than the original sIFR?</h3> ↓ DD_belatedPNG IE6でも透過PNGに簡単に対応させられるライブラリ The EqualHeights jQuery Plugin 異なる高さのブロックを統一してくれるライブラリ ↓ DD_roundies 角丸の簡単実現ライブラリ jQuery.popeye ポップアップではなく、サイト
[JS]jQueryのプラグイン33+1選 -2009年1月
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Ajaxify さまざまなAJAXコンテンツを実装。 Agile Carousel パネルをダイナミックにスライド。 Start/S
リンクを自動で超分かりやすく修飾してくれるJSライブラリ「DLINK」:phpspot開発日誌
-DLINK- automatic link improver - OOPStudios.com リンクを自動で超分かりやすく修飾してくれるJSライブラリ「DLINK」。 次のように、リンクをJavaScriptで自動で色分け&アイコン付与してくれます。<a>タグにclassを指定する必要もありません。 PDF、Flash、SWFなど、各種フォーマットも自動付与。 設置方法は簡単で、以下の３ステップ。 1. まずスクリプトを読み込む <script type="text/javascript" src="http://oopstudios.com/dlink/dlink.js"></script> 2. 色分けしたい部分をdiv.dlinkで囲う 中身に普通にHTML記述 <div class="dlink"> your <a href="#">link filled</a> conten
[JS]高機能なインターフェイスを実装できるスクリプト -UI.Layout
UI.Layoutは、可変タイプのパネルをベースとした自由なインターフェイスを実装できるスクリプトです。 UI.Layout – The Ultimate Page Layout Manager demo(UI Accordion) 上記のデモでは、アコーディオン型のパネルをはじめ、サイズ変更や開閉できるパネルが実装されています。 デモは他にも多数あります。 デモ：ミニマム デモ：シンプル デモ：ネスト デモ：複雑なネスト デモ：アコーディオン デモ：ドロップパネル デモ：フレーム UI.LayoutはjQueryのプラグインのため、実装にはjquery.js、アコーディオンなどのエフェクトにはjQuery UIが必要です。 下記のページから全てのファイルがダウンロードできます。 UI.Layout Plug-in & Related Downloads
jQueryよりも便利？mooToolsの便利プラグイン集:phpspot開発日誌
Best Ever 65 mooTools Plugins and Demos, is it Better than jQuery? : Speckyboy - Web Design, Web Development and Graphic Design Resources jQueryよりも便利？mooToolsの便利プラグイン集。 mooToolsにも多数の便利プラグインが存在しますね。 SmoothScroll スクロールをスムーズにする MultipleSelect 複数選択ウィジェット Typewriter Effect タイプライタ風のエフェクトがつけられる MooColumns レイアウト用ライブラリ News ticker with horizontal scrolling 水平ティッカー MooScroll 独自スクロールバー Show/hide a nice Login
便利なjQueryプラグインいろいろ:phpspot開発日誌
10 Useful jQuery Plugins | AjaxLine 便利なjQueryプラグインが色々とあるみたいですね。 最近では、jQueryの人気が非常に高いように感じます。prototype.jsとかのシェアの状況は今はどうなってるんでしょうね。 Virtual jQuery Keyboar jQuery 3 State Switch Plugin jQuery Quick Search Date Range Picker Tooltips based on jQuery FaceBox ColorPicker 全部見る これだけjQueryプラグインがあるということは、JSフレームワークのシェアはここ数年でちょっと変わってきてるんでしょうね。 関連エントリ jQueryを速攻マスターしたい方におすすめの「jQuery Selectors」 HTMLで雑誌のような美しい段組みレ
jQueryのプラグイン100選 -2008年総集編 | コリス
seekAttention 注目箇所だけハイライトのアニメーションで強調。 スクロール・ドラッグなど操作関連のjQueryのプラグイン
jQuery、CSSなどなどWEB開発に役立つチュートリアル集「30+ Eye-Opening Web Development Screencasts」
jQuery、CSSなどなどWEB開発に役立つチュートリアル集「30+ Eye-Opening Web Development Screencasts」 WEBの技術は日々進歩していて、様々な技術、技法が世の中には溢れていますが、今回紹介するのはjQueryやCSS、PHP、ASP、Ruby on Railsなどなど項目毎に、WEB開発に役に立つチュートリアルを30以上まとめたエントリー「30+ Eye-Opening Web Development Screencasts」です。 どれも実用的で、役に立ちそうなものが多いのですが、今回は紹介されている中から特に気になったチュートリアルをピックアップして紹介したいと思います。 詳しくは以下 ■Coda Slider Effect jQueryを使ったスライダーです。カーソルです、メニューからでもカーソルでも自由に動かせます。 ■ Desig
jQueryを速攻マスターしたい方におすすめの「jQuery Selectors」:phpspot開発日誌
Selectors jQueryのセレクタ関数を速攻マスターしたい方におすすめの「jQuery Selectors」。 jQueryでの$('code') とかって、最初は何を意味するか分かりませんね。 jQuery selectorsを使えば、ボタンを押すことで、指定したエレメントがハイライト＆アニメーション表示されます。 要素がハイライト。 これは便利です。 関連エントリ jQuery 関連記事まとめ jQueryでリッチなグリッドを実装「jqGrid」 ファイルツリー構造を表示するためのJS「jQuery File Tree」 jQueryを使ってパズルを作るjQueryプラグイン
クールにアニメーションする角丸LightBox「prettyPhoto」:phpspot開発日誌
jQuery lightbox clone - prettyPhoto - by Stephane Caron Here's my jQuery lightbox clone, I did it because those available are either not close enough to the real lightbox (lacking animations, not supporting galleries, etc ,etc) or were just not suiting my need.クールにアニメーションする角丸LightBox「prettyPhoto」。 jQueryベースで軽量でクールに動作するLightboxの紹介。 次のようなクールな角丸型。 Lightbox同様、複数枚の画像をページ送りできるギャラリーにも出来ます。 関連エントリ 表示法が新しく
[JS]jQueryのプラグイン33+1選 -2008年11月 | コリス
当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る
jQueryだけで作る、サムネイル画像を魅力的に見せる方法 (1/5)
普段あまり目にしないようなインパクトのあるサイトを作りたい。そんなときにはいつも見ている日本国内のWebサイトだけでなく、海外サイトに目を向けてみるといいかもしれません。これまでにもこの連載ではいくつかの海外サイトを紹介してきましたが、今回見つけたのはアルゼンチンのWebサイトです。 「Sikker」という名前のサイトは、Webデザイナー・Nicolas Calabreseさんのポートフォリオサイト。1ページのみ、スクロール無しの“1枚絵”のようなごくごく小さなサイトですが、その分、CSSやJavaScriptの小技を効かせて、カッコよく楽しいサイトにデザインされています。今回は、このSikkerをお手本とさせてもらうことにします。 今回のお手本サイト：『Sikker』 アルゼンチンのWebデザイナー、Nicolas Calabreseさんのポートフォリオサイト。グローバルブランドのロゴが
[JS]シンプルなjQueryのプラグインが揃っている -Aquaron | コリス
Aquaronは、ナビゲーション、フロートしたエレメントの操作、クッキー・文字列の操作、エレメントの装飾などのシンプルなjQueryのプラグインを配布しているサイトです。
[JS]設置も簡単なテーブルのデータをソートする超軽量のスクリプト | コリス
leigeberから、既存のテーブルにも簡単に設置できる、データをソートする超軽量（1.7KB）のスクリプトを紹介します。 jQueryやPrototypeなど他のスクリプトは必要ありません。 JavaScript Table Sorter demo 動作確認ブラウザは、IE 6/7/8, Fx2/3, Op, Safari, Chromeとなっています。 設置方法は簡単で、既存のものにも簡単に組み込めます。 「script.js」と「style.css」を外部ファイルとして記述します。 tableに「class="sortable" id="sorter"」を記述します。 テーブルの下に下記のスクリプトを記述します。 <textarea name="code" class="html" cols="60" rows="5"> <script type="text/javascript">
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
[JS]省スペースにフェードと自動スクロールで表示するスクリプト -Simple Spy