タグ

2010年9月28日のブックマーク (3件)

  • (Spry改造)マウスカーソルを乗せると動くアコーディオンメニュー

    下準備〜コーディング Adobe Labsから、Spryフレームワークをダウンロード (要Adobe ID) (注)記事でのSpryのバージョンは1.6.1です。 Adobe Labs - Spry framework for Ajax http://labs.adobe.com/technologies/spry/ ダウンロードしたフォルダの中の、widgets >> accordion を今回は使います。 今回は読み込み方は割愛(付属のSpryAccordion.htmlを参照)。次はカスタマイズ方法行くよ〜。 SpryAccordionのデフォルト動作を確認 こちらから確認できます JSファイルを編集 今回は、以下の2点に絞って見ていきましょう(Javascriptはあまり詳しくないので、自分はこれが限界っす…)。 アコーディオンの動くスピードを調整する クリックでアコーディオン動

  • 第9回 ページ内リンクをスムーズにスクロールさせるには | gihyo.jp

    ease系のJavaScriptプラグインで気持ちいい動きを演出 1ページの中に複数のページ要素を配置し、ページ内リンクで移動するタイプのサイトを目にするようになってきました。たとえば2007年度のグッドデザイン賞 コミュニケーションデザイン部門を受賞した石川県の温泉「多田屋」のサイトは、Flashを使い、1枚の大きな絵の中をスクロールして移動するUIとなっています。 図1 石川県の温泉「多田屋」のサイト 最近では、Flashではなく、JavaScriptを使って静的なページの中を遷移するタイプのサイトも見かけるようになりました。たとえば「Pline Studios of Architecture」はとても美しいUIとなっています。 図2 JavaScriptでページ内を移動する「Pline Studios of Architecture」 実装にはMITライセンスのscrollto.js

    第9回 ページ内リンクをスムーズにスクロールさせるには | gihyo.jp
    irisjp
    irisjp 2010/09/28
    ページ内リンクをスムーズに移動させるテクニック。
  • jQuery UIのウィジェットを使ってみよう

    対象読者 jQuery UIに興味があり、使ってみたいと思っている方 必要な環境と準備 jQuery UIのダウンロード 執筆時点のjQuery UIの最新版は、1.8.2です。第1回を参考にダウンロードしましょう。 Dialog Dialogは、ユーザのアクションに対して、警告、問い合わせなどのダイアログを表示させたいときに利用します。例えば、ユーザ登録時に「登録します。よろしいですか?」といったメッセージや、データを削除させる時に「削除しますが、よろしいですか?」などのメッセージを表示させることができます。 今回は、ボタンをクリックすると、[OK]と[キャンセル]ボタンが配置されたダイアログが表示されるサンプルを取り上げます。 リスト1にDialogプラグインの使用例を、図1、図2に実行結果を示します。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

    jQuery UIのウィジェットを使ってみよう
    irisjp
    irisjp 2010/09/28
    jQuery UI解説。