jQueryで作るタブ + cookieでその状態を保存
jquery.cookie.jsを使い、状態を保存できるタブインターフェイスの作成です。 角丸タブインターフェイス 今回はためしに、角丸のタブインターフェイスで作成してみました。 ただし、FireFoxとSafari限定です。IEだと、ただの四角。。。 HTMLソース <ul id="tab"> <li><a href="#yahoo...続きを読む
jquery.cookie.jsを使い、状態を保存できるタブインターフェイスの作成です。 角丸タブインターフェイス 今回はためしに、角丸のタブインターフェイスで作成してみました。 ただし、FireFoxとSafari限定です。IEだと、ただの四角。。。 HTMLソース <ul id="tab"> <li><a href="#yahoo...続きを読む
最近よく見かける「ページTOP」のスクロールをjQueryでは簡単に実装できます。 Javascriptソース $(function(){ $("a[href^=#]").click(function(){ var Hash = $(this.hash); var HashOffset = $(Hash).offset().top; $("html,b...続きを読む
ツールチップは、案外簡単に実現することが出来ました! HTML・CSSソース a要素にtooltipクラスを付け、表示させる内容をspan要素のtooltipContクラスに記述します。 CSSソースはtooltipContクラスの「display:none」「position:absolute」と「z-index」が必須で、表示の装飾は任意で行って下さい。 <a class="...続きを読む
jQueryのanimateを使って、簡単な画像拡大の動きの検証をしてみます。 3つの動作 animateを指定する際に、stop()を指定することで、動きを制御出来ます。 .animateのみ stop()を記述しない場合は命令の実行の回数分、動作します。 例えば、連続してマウスオーバーすると回数分命令が実行されます。 stop().animate stop()を記述すると、命令が実行中に他の...続きを読む
グローバルメニューでよく使われるドロップダウンメニューですが、 jQueryのanimateを使って動きに装飾を加えます。 HTMLソース <ul id="mainNav"> <li><a href="">Adobe</a> <ul class="subNav"> ...続きを読む