facebookのステータスをページに簡単に埋め込めるjQueryプラグイン「fbStatus」:phpspot開発日誌
abitlikethis's fbStatus at master - GitHub facebookのステータスをページに簡単に埋め込めるjQueryプラグイン「fbStatus」。 facebookが盛り上がってきているらしい今日この頃ですが、便利なjQueryプラグインがあるみたい。 TwitterみたいにステータスをWEBサイトに表示させたい場合に使えそうです。 次のように使い方は超簡単です。 $(".facebookfeed").fbstatus({ username: 'prettyklicks', // 表示するusername count: 5, // 表示件数 loading_text: "loading status..." // ロード中のテキスト }); 関連エントリ FacebookのGUIレイアウトのPhotoshopテンプレートファイル ページフッタに置
再生ボタン等も変更できちゃうYoutube操作jQueryプラグイン「jQuery Youtube Player」:phpspot開発日誌
再生ボタン等も変更できちゃうYoutube操作jQueryプラグイン「jQuery Youtube Player」 2010年10月26日- jQuery Youtube Player 再生ボタン等も変更できちゃうYoutube操作jQueryプラグイン「jQuery Youtube Player」 このプラグインを使えば次のように、Youtubeの動画に独自の再生、動画送り、リピートボタン、ボリュームボタンの他、プレイリストを付けてリストから再生なんていうことができちゃいます。 YoutubeのコントロールはFlashの中にあるから無理と思っていましたがYoutubeのFlash側で対応したっぽいですね。（外部からJSでFlash内で公開された関数を操作してるようです） ↑プレイヤー下部のリストがプレイリスト。クリックで動画が切り替わります。 ↓現在再生中の秒数なんかも取れたりするようで
Davor Spasovski / Web Developer
spriteTimer is a jQuery countdown/countup timer plugin that uses a CSS sprite for the numeric digits and punctuation. The examples below are done using Rosewood font at 72pt so you'll most likely want to change this to the font, color, and size of your choice. Please refer to the demo pack for more examples including the sample numbers.png so that you know how to slice your own image sprite. Chang
画像を使った綺麗なタイマーが実装できるjQueryプラグイン「spriteTimer」:phpspot開発日誌
Davor Spasovski / Web Developer 画像を使った綺麗なタイマーが実装できるjQueryプラグイン「spriteTimer」。 次のような１枚の画像を使って簡単に綺麗なカウントダウン＆カウントアップタイマーが実装できます。 タイマーを表示されるなら味気ないテキスト表示よりも画像で綺麗にやりたいですよね。 画像なので、画像編集ツールを使って簡単にフォントやデザインを替えられます。 元画像。これをjQueryでCSSスプライトを活用してタイマーにします。 残り１時間に設定したカウントダウンタイマー。ちゃんと時間表示になってますね。 カウントアップにも対応。スタート/ストップボタンによってタイマーの制御も出来ます。 地味に使いそうなので覚えておいてもよさそう。 関連エントリ 画像にぼかし効果を与えられるjQueryプラグイン「Image Blur」 色合いを選べるツール
jQuery Youtube Player
The jQuery Youtube Player plugin builds a custom youtube video player, toolbar and playlist area. Examples: Basic Advanced Embedded Multiple Playlists Custom Playlist Positioning Custom toolbar buttons Themes Userguide Userguide Issues/Feature requests If you notice the plugin is working as expecting, or would like to request new features, please use the issue tracker. Tested on: FF3.6; IE 6, 7 an
軽量でいい感じの画像スライダー実装jQueryプラグイン「Choco-Slider」:phpspot開発日誌
Choco-Slider | A very tasty jQuery Plugin 軽量(7KB)でいい感じの画像スライダー実装jQueryプラグイン「Choco-Slider」のご紹介です。 実際のスライダーは次のような感じ。 画像切替の際のアニメーションはチョコをかけるような効果でいい感じに動きます。 画像の説明を画像下にテキストで入れることも可能です。予めULリストで定義しておきます。 １つの選択肢として覚えておいてもいいですね。 関連エントリ 軽量のイメージスライダー実装jQueryプラグイン「Orbit」 jQueryとCSS3で作るカラフルなスライダーウィジェット jQueryでいい感じのコンテンツスライダーを作成するチュートリアルとサンプル JavaScript製の画像スライダー・ギャラリーいろいろ
Choco-Slider |
Liviano Flexible Personalizable Liberado bajo MIT licence Compatible con Firefox 2+, IE 6+, Safari v4, Opera v10, Google Chrome 3+ y Opera 9+ Descargue los archivos del Choco-Slider (Javascript y CSS). Una vez hecho eso, incl�yalos en el sitio, junto a la librer�a jQuery: <link rel="stylesheet" href="chocoslider.css" type="text/css" /> <script type="text/javascript" src="jquery.chocoslider.js"></s
JQuery Sidebar Plugin for bloggers
This is small and simple sidebar plugin made with HTML,CSS and JQuery.which can be used for many purposes like for ‘Follow me’ link, ‘contact us’ page, or anything you want.It positions itself at Left/Right side of the page, this can be configured easily with config option “position”. You can modify its look and feel by making change in style/style.css file View DemoDownload Source
JQuery Sidebar Plugin for bloggers
This is small and simple sidebar plugin made with HTML,CSS and JQuery.which can be used for many purposes like for ‘Follow me’ link, ‘contact us’ page, or anything you want.It positions itself at Left/Right side of the page, this can be configured easily with config option “position”. You can modify its look and feel by making change in style/style.css file View DemoDownload Source
スクロールしても常にサイドに要素を固定で表示できるjQueryプラグイン「JQuery Sidebar Plugin」:phpspot開発日誌
スクロールしても常にサイドに要素を固定で表示できるjQueryプラグイン「JQuery Sidebar Plugin」 2010年11月10日- Amit Patil's Blog スクロールしても常にサイドに要素を固定で表示できるjQueryプラグイン「JQuery Sidebar Plugin」。 サイドに常に表示されている「Follow Me」みたいなツイッターのフォローボタンは最近よく見かけますね。 これをjQueryで簡単に実装してしまおうというもの。 使い方は次のようにオプションを渡してあげるだけです。 $(function() { $("body").sidebar({ text : "Follow Me", // 表示テキスト size : "30px", // 幅 length : "200px", // 高さ margin : "130px", // マージン p
マンガは無料で読む時代！？無料でいますぐマンガが読める方法のまとめ。 | nanapi[ナナピ]
マンガは無料で読む時代！？無料でいますぐマンガが読める方法のまとめ。に関するライフレシピをご紹介します。nanapi [ナナピ]は、みんなで作る暮らしのレシピサイトです。電子書籍化！ 最近よく耳にする「電子書籍」という言葉。 iPadやAndroid、Kindleの登場で、今出版界が大きく電子化の流れに動いているのは皆さんご存知ですよね。 今やいろんなデバイスで本をデジタルで買えるようになってます、 ホリエモンの本などもAppStoreで買えるようになっていますし、話題になった「もしドラ」なんかもデジタルで買える時代です。 そんな電子書籍化の流れの中で、気になるのはやっぱりマンガ！ マンガは日本の携帯電話コンテンツとしていち早く成長していて、とても早くから電子化が進んでいるんです！ どうして無料で読めるのか 電子化されることで、紙や流通のコストが削減され、もっとコンテンツの本質に対
Google ChromeをRAMディスクに丸ごとインストールして超高速化する方法！ | フリーソフトラボ.com
前回のエントリーで、FirefoxをRAMディスクに完全インストールして信じられないほど高速化する方法を紹介しましたが、同様にGoogle Chromeも、キャッシュの保存場所をRAMディスクに置き換えるだけでなく、RAMディスクに丸ごとインストールしてしまえば、より高速化することが可能です。しかしながら、Chromeの場合はインストール時にフォルダの指定ができないため、普通はOSがセットアップされているHDDにしかインストールすることができません。 そこで、ここでは”ジャンクション”と呼ばれる手法を用いて「表向きはあたかもHDDにアクセスしているように見えるが、実際にはRAMディスクドライブにアクセスしている」という状態を作りすことで、Google Chromeの起動に必要なデータを丸ごとRAMディスクから呼び出し爆速動作させるという、裏技的な方法を紹介します。 なお、この記事ではあらか
Windowsのインストーラみたいな便利なウィザードをブラウザ上で簡単実現できるjQueryプラグイン「SmartWizard」。:phpspot開発日誌
Windowsのインストーラみたいな便利なウィザードをブラウザ上で簡単実現できるjQueryプラグイン「SmartWizard」。 2010年11月18日- Tech Laboratory Windowsのインストーラみたいな便利なウィザードをブラウザ上で簡単実現できるjQueryプラグイン「SmartWizard」。 Windowsインストーラーは「次へ」を押していくとどんどんインストールを進められて簡単ですが、それをブラウザ上で簡単に実現してしまえます。 各ページの中身は、単純に<div>で並べるだけというお手軽さ。ルールに従ってHTMLを記述し、$(element).smartWizard() で初期化するだけです。 デモページはこちら タブを左にレイアウトしてもなかなかいい感じ。 デフォルトのデザインはお世辞にもカッコイイとは言い難いのですが、CSSデザインが可能なので、自由にスタ
Tech Laboratory - Smart and free open-source jQuery plugins
The 404 or Not Found error message is an HTTP standard response code indicating that the client was able to communicate with a given server, but the server could not find what was requested. Anyway we are lost a little bit, Can you help find the missing child? Popular jQuery PluginsjQuery Smart Wizard 4 The awesome jQuery step wizard plugin with Bootstrap supportjQuery Smart Cart 3 The smart inter
jQuery Background Position
A jQuery plugin that allows the position of a background image to be animated. The current version is 1.1.1 and is available under the MIT licence. For more detail see the documentation reference page. Download now Basics Positions Options In the Wild Quick Ref You can animate the position of a background image as either 'backgroundPosition' or 'background-position', providing both the horizontal
ブロック要素の背景だけアニメーションさせて注意をひけるjQueryプラグイン:phpspot開発日誌
ブロック要素の背景だけアニメーションさせて注意をひけるjQueryプラグイン。 ブロック要素があって、背景だけをアニメーションさせるという効果を簡単に作成できるようです。 要素中のテキストは動かないので、ページ全体のブロック要素の背景をパッとアニメーションで切り替えるのも面白い効果が得られるかもしれませんね。 ちょっと分かりづらいと思うのでデモを見てください。 関連エントリ 伸縮する全画面背景を設定できるjQueryプラグイン「Supersized」 ブロック内の背景画像をスクロールアニメーションするjQueryサンプルプログラム 背景画像をクールにかえつつナビゲーションを行うjQueryでのメニュー実装例
ナビゲーションメニューに関する有用なjQueryチュートリアル集:phpspot開発日誌
26 Useful jQuery Navigation Menu Tutorials - Web Design Blog ? DesignM.ag ナビゲーションメニューに関する有用なjQueryチュートリアル集のご紹介。 ２６にもわたるチュートリアルになっていて、プラグインではありませんが、参考にすることで実装は容易でしょう。 クールな見た目が多いのもいいですね。 沢山の種類があるのでイメージにマッチしたものも見つかりそうです。 関連エントリ 長い文書ページでもナビゲーションを付けて分かりやすくできるjQueryプラグイン「jQuery One Page Navigation」。 階層ナビゲーション実装ライブラリ集 背景画像をクールにかえつつナビゲーションを行うjQueryでのメニュー実装例
ページ内の画像が全部読まれた場合にイベントを発生させられるjQueryプラグイン「onImagesLoad」:phpspot開発日誌
ページ内の画像が全部読まれた場合にイベントを発生させられるjQueryプラグイン「onImagesLoad」 2010年11月12日- Official documentation for the jQuery 'onImagesLoad' plugin - by Cirkuit Networks, Inc. ページ内の画像が全部読まれた場合にイベントを発生させられるjQueryプラグイン「onImagesLoad」 ブラウザの標準機能ではonloadはありますが、画像を読み込んだタイミングで発生させるonImageLoadを発生させられるjQueryプラグインです。 単純に、ページ全体の画像というくくりだけでなく、特定の<div>内の画像を全部読み込んだ後で発生させることも出来るみたいです。 AJAXを活用したダイナミックなサイトで活用できそうですね。 具体的な動作サンプルはサイトでチェ
Official documentation for the jQuery 'onImagesLoad' plugin - by Cirkuit Networks, Inc.
Current Version: 1.2.2 - Last Updated: May 13, 2013 - Regularly verified as compatible with the newest jQuery libraries (currently, version 1.10.2) 'onImagesLoad' is a simple jQuery plugin that will callback a function when: 'All' images within the entire $(selector) have loaded 'Each' item within the $(selector) has loaded its own images Examples Example 1 - Callback when all images have loaded o
電光掲示板のようにニュースをクールにアニメーション表示できる「jquery vticker」:phpspot開発日誌
jquery vticker (vertical news ticker) JugBit 電光掲示板のようにニュースをクールにアニメーション表示できる「jquery vticker」。 特定のdivに次のようにulでリストを定義しておいて、$(element).vTicker(); とすることで簡単にアニメーションするニュースティッカーが実装できます。 幅、高さは固定できるので、自由にレイアウトできるところもナイスです。 表示時間が終わって消えるリストがグレーにフェードアウトするところも芸が細かくてナイス。 デモを見る デモはCSSでスタイリングされておらず味気ないものですが、CSSで綺麗にデザインしてあげることでかなり映えそうです。 オプションで、次の挙動についてカスタマイズも可能です。 ・スピード変更 ・待ち時間変更 ・アイテム表示数変更 ・アニメーション指定 ・マウスで停止するか指定
wwWendt - Tech - jquery.dynatree
Tech » jquery.dynatree.js Dynatree Dynatree is a JavaScript dynamic tree view plugin for jQuery with support for lazy loading of branches. Main features: Optimized for large dynamic trees (DOM elements are only created when really needed). Programmable through a rich object oriented interface. Support for lazy loading and Ajax. Checkboxes and hierarchical selection. Supports drag and drop. Support
Dynatree - Example Browser
<body> <p>This page requires frames.</p> </body>
WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラグイン「jquery.dynatree」:phpspot開発日誌
WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラグイン「jquery.dynatree」 2010年11月25日- jquery.dynatree.js | jQuery Plugins WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラグイン「jquery.dynatree」。 次のように、デザインそっくりのUIが比較的簡単に実現できます。 スキンに対応していて、次のように、Vistaっぽくすることも可能 アイコンを付けてより分かりやすくすることもできます。 ドラッグ＆ドロップも出来たりします。移動している最中のUIもWindowsアプリそっくり 各ツリーはAjaxに対応していて、読み込み時に全部読む必要がなく、巨大なツリーを表示することにも対応しています。 Windowsアプリなんかでは何かと便利なこのUIですが
[JS]背景やボーダーの不透明度をアニメーションで変更するスクリプト -Transify
IE6にも対応した、指定したエレメントの背景やボーダーの不透明度をアニメーションで変更するjQueryのプラグインを紹介します。 IE6でのキャプチャ Transifyの特徴 あらゆるエレメントの背景とボーダーの不透明度を変更します。 設置は簡単で、軽量のスクリプト。 主要ブラウザの全てで動作します。 機能するのは、背景のカラー、背景の画像、ボーダーです。 マウスのホバーで、不透明度をアニメーションで変更します。 jQuery1.4.3でテスト済みです（前のバージョンでも動作します）。 [ad#ad-2] Transifyの実装 「jquery.js」と「transify-min.js」を外部ファイルとして指定し、下記のように記述します。 「#selector」は任意のエレメントを指定します。 $('#selector').transify(); デフォルトでの不透明度は60%に設定されて
Transify – a jQuery plugin to easily apply transparency / opacity to an element’s background | The Blog of Joren Rapini
In my search for a solution to make a background / border of an element transparent, I found that there really isn’t a perfect one that fit a particular need. IE6, IE7, and IE8 do not support CSS3′s alpha background color value nor do older versions of other browsers, 8-bit PNG’s do not look great in Internet Explorer, and other javascript PNG fixes are not great for performance nor will they work
ZendFrameworkとExtJSを使った超リッチかつ多機能なCMS「pimcore」:phpspot開発日誌
pimcore - Enterprise Content Management Framework ZendFrameworkとExtJSを使った超リッチかつ多機能なCMS「pimcore」 それなんてアプリ？といってしまいそうなリッチな管理画面やWYWIWYG編集、コンテンツのバージョン管理、A-Bテスト等、機能盛り沢山となっています。 管理画面を一見しただけでその高機能さが伺え、使ってみたいという気にさせられます。 バージョン管理機能がいい感じで、次のように、修正前、修正後がtracみたいにわかりやすく表示してくれます。 コンテンツはリッチで綺麗なUIで編集することができるみたいです。 ファイルはツリーで管理でき、画像とかはなんとWEB上でPhotoshopっぽいツールで編集できるようです。 CMS上にコンテンツと連動させた形で、GoogleAnalyticsのAPIを使った解析画面も
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - abitlikethis/fbStatus: A super lightweight tool to display a publicly accessible facebook status. Inspired by the code example by Pretty Klicks http://www.prettyklicks.com/blog/making-a-facebook-feed-using-the-graph-api-json-and-jquery/291/
jQuery Youtube Player Example
5.1GBまで無償の国産オンラインストレージサービス“ソラ箱”向けクライアントNOT SUPPORTED
綺麗にデザインされたフリーのHTML/CSSテンプレート１０:phpspot開発日誌
http://techlaboratory.net/labs/SmartWizard/index.htm
Example 1 - jQuery 'onImagesLoad' plugin - by Cirkuit Networks, Inc.
Loading...
Loading...
Transify Demo