超クールな雑誌風UIを全画面表示できるJavaScriptフレームワーク「Treesaver」

0

20110207-01

雑誌風UIで全画面表示できる方法を探している。
そんな方におすすめなのが、「Treesaver」です。

特徴的なのが、画面サイズによるコンテンツの表示切り替えです。
PC等の大画面の場合と、iPhoneで見た場合とで文字の量を変化させて読みやすいようにしてくれています。

iPhoneだと右左へスライドするとページ遷移できるので、かなり見やすそうでした。

使ってみた様子

以下に使ってみて特徴的な動作を上げてみます。

■ 画面左側にあるタブでメニューが一覧表示

20110207-02

↑タブをクリックしてみます。

20110207-03

するとコンテンツのメニューがサムネイル入りで表示されます。

■ 常に固定のメニューが表示できる

20110207-04

雑誌メニューとは別に連絡先やTwitterへのリンクなどを表示させることができます。

■ ページ移動はボタン、キーボード、スライド方式

20110207-05

↑ページの移動はボタンクリックか、キーボード、iOSの場合はスライドで移動できます。これ地味に便利です。

■ 画面サイズによるコンテンツ切り替え

画面のサイズによって表示するコンテンツの要素を自動的に切り替えてくれるようになります。

20110207-06

↑PCで見た場合

20110207-07

↑iPhoneで見た場合

色々便利機能があって素敵ですね。ダウンロードとデモは下のリンクからどうぞ。

HTML5とjQueryで作られたビデオプレイヤー「jMediaelement」

0

jMediaelement」はHTML5とjQueryで作られたビデオプレイヤーです。

カスタマイズを前程に作られているようで、各ボタンを操作した際のイベントの設定など細かくできるようになっていました。

Youtubeの動画も再生できるようです。

20100619-05

jQueryを使用してドラッグ&ドロップでファイルをアップロードできる「Plupload」

0

Plupload
Pluploadはオープンソースのファイルアップローダーで、jQueryを使用してファイルのアップロードやリサイズ処理を行う事が可能になっています。

アップロードには複数のプラットフォームから選択可能で、FlashやSilverlightを使用する事も可能。

作者はTinyMCEの開発者の方だそうです。これは期待できますね。

詳しくは以下