MT100本をAmazonで購入!

yuga.js 0.4.2 - 優雅なWeb制作のためのJSとデモ

12月08日(土)05:30

category
JavaScript

yuga.js Logoひょんな事から、yuga.jsを作られたKyosukeさんから未公開最新版のyuga.js 0.4.2 をもらっちゃいました!

嬉しさのあまり、本人に公開と配布の許可を確認したら快諾していただいたので、せこせことデモページも作ったっす。
元々CSS Nite LP2で紹介したJSなんで、デモっぽいデモも無いかな?と思い用意したというのもあるのですが。

あ、yuga.jsってのはjQueryのプラグインです。jQuery使って優雅なWeb制作しちゃおーっていう感じだとボクは思ってます。

まぁ何はともあれデモをば。

デモページは、IE6無視してます。IE6でどんなに素敵なことになってても仕様です。
ですので、Fx、IE7、Opera、Safari3(Winでしか見てないけど)辺りで見ていただければ良いかと思うです。

であ、設置方法などの説明をば。

---- こっから続き

Verアップに伴い、今回新しく「グループ化されたロールオーバー」という機能が追加されました。
これは、テキストリンクとロールオーバーしたい画像が同じaタグ内に有る場合、テキストリンクにカーソルを合わせても、画像がロールオーバーするというものです。
うまく使えば、効果的かもです。

その他、mailtoがあると、それ以降の指定がエラーで動作しなくなるという問題も修正されております。
冒頭で書いた、「ひょんなこと」ってのはコレが切っ掛けだったり。

使用方法

XHTMLのhead要素内で次のように読み込みます。

 
<link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/interface.js"></script>
<script type="text/javascript" src="js/thickbox.js"></script>
<script type="text/javascript" src="js/yuga.js" charset="utf-8"></script>

これで基本的にOKです。
後は条件を満たせばその機能が使えるという感じです。

その辺りの説明はデモページに書いてありますので、ご参照ください。

ライセンスとか

yuga.jsは当然ながら、Kyosukeさんに帰属します。

具体的には、

という感じです。

その他注意事項

  • ボクがyugaマスターではないので、デモページでは紹介しきれていない機能があると思います。
    書いてない使い方とか見つけたら教えてくれると嬉しいっす。もちろんミスも気づいたら教えて頂けると幸いです。
  • JS自体に関するご質問は、ボクに寄せられても十中八九答えられない自信があるのです。
    ですから、基本的なこと(設置できないとか)以外は答えられないかと思います。
  • デモページはボクが勝手に作ったものなので、Kyosukeさんにご迷惑をお掛けしない感じでお願いします。
    本人が公開している訳では無いので、直接の質問などはマナーや節度を守ってお願いします。(質問自体NGかしら?)
各種SBMに追加
  • Hatenaブックマークに追加
  • del.icio.usに追加
  • POOKMARK Airlinesへ追加
  • livedoorクリップへ追加
  • ニフティクリップへ追加
  • newsingへ投稿
  • Redditへ追加

comment [1]

1 - ametyoko さん

http://css-happylife.com/log/css-template/000178.shtml

にて、

> その他、mailtoがあると、それ以降の指定がエラーで動作しなくなるという問題も修正されております。

のことをお尋ねした者です。この修正が入ったとのことでありがたく使わせていただきます。ありがとうございました^^
js作者さんのサイトでは新しいバージョンがでていましたが、interface.jsが廃止になったので、他のjsとの併用がより可能になった感じがするので楽しみです。

2008年3月13日 16:06

コメント投稿フォーム

post your comment

※コメントが認証されるまで、コメントは反映されません。ご了承くださいませ。

ブログパーツ

フィードメーター - CSS HappyLife

Feeds購読数

あわせて読みたい

change color or layout
  • デフォルトカラー
  • 薄い青
  • 青緑
  • 緑
  • 青
  • 薄い紫
  • ピンク
  • 黄金
  • 茶
  • 赤
  • 黒
  • 白
  • シルバー
  • 2カラム(カラーはデフォルト)
  • リキッドレイアウト(カラーはデフォルト)

ページトップへ