JavaScript Category Archive

JavaScript カテゴリの記事一覧。(4 / 5 ページ)

JavaScript でタブ切り替え UI を実装する

先日、タブ切り換えタイプの UI を、JavaScript と CSS で簡単に実装する仕組みを探していて (他力本願)、ちょうど求めていたスクリプトが Archiva さんで紹介されていたので使わせていただきました。

時間がなかったので、できれば自分では書きたくないなぁ、なんかいいの公開している人いないかな~なんて思っていたのですが、おかげ様で助かりました。ということで、お礼を兼ねて紹介させていただきます。

タブ切り換えを実装する JavaScript ライブラリやサンプルソースはいくつか存在しますが、私が求めていたのは JavaScript が OFF の時でもページ内リンクとしてタブが機能するもの。 Archiva さんのスクリプトはピッタリでした。

Posted by:

12 のレイアウトを切替可能なテンプレート

1つのテンプレートで 12度おいしい XHTML + CSS テンプレートを公開してみたいと思います。といっても、ごく普通のテンプレートに CSS 切り替え機能を付けただけなんですが、Blog や Webサイトを作られる際のベースとして役立てて頂けたらうれしいです。

Posted by:

JavaScript でバナーをクロスフェード表示

以前、「div要素をクロスフェード表示する JavaScript」 として紹介した 「Javascript / CSS Crossfader」 を実際に当サイトで使用したので、ひとつの使用例として公開したいと思います。

といっても普通に使っているだけで特に変わったことをやっているわけではないのですが、前回紹介した際に div 要素をクロスフェードすると書いたので div 要素専用っぽい説明になっていましたが、実際は div 要素以外でも使用することができるので、その辺も合わせて説明を。

Posted by:

div 要素をクロスフェード表示する JavaScript

結構前に公開されているので、すでに使っている人もいるかと思いますが、最近、個人的な用途で使わせていただいたので紹介。

Brand Spanking New で公開されている、「Javascript / CSS Crossfader」 は、JavaScript ひとつで簡単に、任意の div 要素 (じゃなくてもいいんですが) をクロスフェード表示で切り替えてくれるスクリプト。スクリプト自体が軽いのと、設定も簡単なので、ちょっとした画像の切り替えなんかに重宝しそう。

Posted by:

MT & HTML Slidy でスライドを作る

プレゼンテーションに使用するスライド資料といったら、パワーポイントのようなソフトウェアで作るのが一般的ですが、最近は、ブラウザ上で動作するスライドショーを使用している方をセミナーなどで頻繁に見かけるようになりました。

このブラウザ上で動作するスライドは、(X)HTML + CSS + JavaScript で実現できます。スライド制作用 JavaScript ライブラリとしては、W3C で公開されている 「HTML Slidy」 が使いやすく有名ですが、個人的にもこの 「HTML Slidy」 を利用したスライドをどこかで使ってみようと思っていたところでしたので、いい機会ということで、テンプレートを作って公開してみることにしました。

Posted by:

滑らかに開閉するメニューのサンプル

menu sample以前、個人的に作っていたサイトで、なんかメニューの見せ方を工夫できないかなと思って、「prototype.js」 と 「effects.js」 を利用してやってみたのが今回紹介するメニューのサンプル。

マウスオン / オフすると、隠れているサブメニューが滑らかに閉じたり開いたりします。クリックで開いたり、折りたたまれたりするメニューはよくありますが、それに無駄なエフェクトを施した版といったところ。

Posted by:

小技の効いた 「ブックマークに追加」 ボタン

ソーシャルブックマークサイトリニューアルの際に、旧デザインで各エントリーページに付けていた、hatena ブックマーク、del.icio.us 等ソーシャルブックマークへの追加ボタンをはずしてそのままにしていたのですが、これを再度掲載することに。

その際、単にアイコンを並べただけでは味気ないので、ちょこっと小技を効かせてみました。

Posted by: