2013-08-30

jQueryのカルーセルスライダーはいろいろ種類がありますが、
最近ではレスポンシブ対応、スマホ対応のものもかなり増えてきました。

そういう中で何を選ぶか、というのもかなり難しいところなのですが、
Elastislideというプラグインを使った案件で、気になった点があったので変更しました。

(さらに…)

2012-06-15

jQuery
主にページトップなどで使うことの多いスムーススクロール。
ページトップだけでなく、どこのページ内リンクにもスムーススクロールするには
プラグイン的なものもありますが、他のものとの相性がよくなかったりしたので、
普通にコードを書くことにしました。

<script type=”text/javascript”>
$(function(){
// #で始まるアンカーをクリックした場合に処理
$(‘a[href^=#]’).click(function() {
// スクロールの速度
var speed = 800;// ミリ秒
// アンカーの値取得
var href= $(this).attr(“href”);
// 移動先を取得
var target = $(href == “#” || href == “” ? ‘html’ : href);
// 移動先を数値で取得
var position = target.offset().top;
// スムーススクロール
$($.browser.safari ? ‘body’ : ‘html’).animate({scrollTop:position}, speed, ‘swing’);
return false;
});
});
</script>

こういうよく使うjQueryを集めたライブラリみたいなものも最近はよくありますよね。
(最近でもないですかね、、)
自分でもそういうのを作っておくと便利かも。


参考サイト
http://www.coolwebwindow.com/weblife_column/coolweb/000301.php

2012-06-12

jQuery
ナビゲーションの開閉メニューあたりでクッキーを使いたいと思い、
jQueryで何かあったような、と調べてみると予想通りにありました。
jquery.cookie.js そのままズバリなプラグインです。

(さらに…)

2012-06-10

jQuery
fancybox(v2.0.6)のiframe機能を使って、あるHTMLページを表示させようとしたところ、
コンテンツの高さをheightで指定しているにもかかわらず、100pxくらいの小さい高さしか
表示されない現象が起こりました。

指定するページをYahooとかの外部サイトにすると問題なく表示されるのに、
自分のサイトのページだといくらやっても狭い表示に。。

(さらに…)

2012-05-14

画像の一覧をページが表示されたときに、順番にフェードしながら表示するjQuery。
あんまりやりすぎるとくどくなったりもするのですが、
イメージを打ち出したいポートレート系のサイトなどではいい感じになると思います。

(さらに…)

2012-04-23

ページが表示されたら一瞬遅れで、ポップアップのようなレイヤーを表示するjQueryです。
ポップアップを出すのはイヤがられることもありますが、
ちょっと興味を引かせたり、どうしても見てほしい案内を出すときには
やっぱり便利ではないかなと思います。

(さらに…)

2012-04-10

ナビゲーションメニューで、現在のページ(カレントページ)の場合は、
該当メニューの画像を変更してどのページにいるかわかりやすくする、というやり方です。
これまでも普通にやっていたのですが、あらためてどうするのが楽か、というのも含めて。

(さらに…)

2011-11-29

テーブルの項目をソートさせるjQueryプラグイン、Table sorterを使おうと思ったのですが、
数値のソートには少しコツがいるようです。

(さらに…)

2011-10-20

ナビゲーションメニューをロールオーバーしたときに、
背景色をjQueryでふわっと変える方法です。

ポイントはjQueryのanimate関数でstopを使うこと。
これを使用しないと、マウスポインタを何度もメニュー上で動かしたときに
それがすべて実行され、チラチラして気持ち悪いだけでなく、
マウスポインタを外してもすべて完了するまで動いてしまいます。

(さらに…)