[B! jQuery][JavaScript][Image] clavierのブックマーク

[JS]サイズが不明でバラバラな複数の画像を指定サイズにフィットさせて配置するスクリプト -ImageFit

サイズが不明でバラバラな複数の画像を指定サイズにトリミングして配置したり、画像全体が収まるように配置することもできるjQueryのプラグインを紹介します。 ImageFit ImageFit -GitHub ImageFitのデモ ImageFitの使い方 ImageFitのデモデモはサイズがバラバラな画像が6枚、それぞれ同じサイズの矩形に配置します。下のキャプチャは同じサイズの画像のように見えますが、既にトリミングして配置された状態です。

clavier 2014/01/19

リンク

シンプルなパララックス効果付きのイメージスライダーを実装するjQueryプラグイン・jQuery Destaque - かちびと.net

この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。画像がスライドする際に視差効果を与える事が出来るjQueryプラグインのご紹介。イメージスライダーとは相性良さそうですね。シンプルなものですが、応用も出来そうです。パララックスなイメージスライダーです。画像をスライドさせるとテキストがやや遅れて動きます。デモが目にやり場に困る写真ですが・・工夫すれば訴求力のあるコンテンツに出来そうです。アニメーションはeasing使ってますです。 $('.foo').each(function(index, el){ $(this).destaque({ slideMovement: 100, slideSpeed: 1000, elementSpeed: 1100, easingType: "easeInOutExpo

clavier 2012/10/29

リンク

http://www.blurjs.com/

clavier 2012/03/09

リンク

クリエイティブなCSS3テクニック集「CSS3 Image Galleries, Slideshows and Image Effects」

TOP > WebDesign > クリエイティブなCSS3テクニック集「CSS3 Image Galleries, Slideshows and Image Effects」限られたスペースを有効に利用するため、もっと魅力的に写真を見せるためにスライドショーを利用しているという方は非常に覆いと思いますが、今回紹介するのはCSS3で実現するクリエイティブなスライドショー集「CSS3 Image Galleries, Slideshows and Image Effects」。 Sliding Image Panels with CSS3 文字や、写真の動きなど、今までのスライドショーにはなかったギミックやエフェクトがCSS3によって実現されています。いくつかのスライドショーが公開されていますが、今日はその中から幾つか気になったものをピックアップして紹介したいと思います。詳しくは

clavier 2012/03/05

リンク

異なる幅・高さの画像も超綺麗に整列させるjQueryプラグイン「Atteeeeention plugin」:phpspot開発日誌

異なる幅・高さの画像も超綺麗に整列させるjQueryプラグイン「Atteeeeention plugin」 2011年04月07日- Google image search style image alignment with jQuery Atteeeeention plugin | DreamersLab 異なる幅・高さの画像も超綺麗に並べられるjQueryプラグイン「Atteeeeention plugin」。 <img>でただ単に画像を並べると、幅、高さの違いから、ページがごちゃごちゃしてしまいますが、このプラグインを使うことでGoogle の画像検索のように綺麗にピッチリ並べられます。普通に並べるとちょっと残念なことに。空白ができちゃいます。プラグインを使うことで、あら綺麗。となります。 Firefox は 2以上、IEは6以上ということで殆どのブラウザに対応。まず、必要な

clavier 2011/04/07

リンク