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かしら?)