ギャラリー等を面白く見せられるjQueryプラグイン「Minimit」:phpspot開発日誌
Minimit Gallery Plugin - Download ギャラリー等を面白く見せられるjQueryプラグイン「Minimit」 このギャラリー他にはない感じで次のように要素をCSS3のプロパティなんかを駆使して変形、アニメーションさせながら切り替える等のインタフェースを提供します。 デモを見てみるのが一番速いですが、とても面白いです トランプのカードを拡大するような（？）。ちょっと動きを見ていただくのが一番速そう。 リストもマウスに応じてクネクネ動きます。 クネクネ。 マウス位置に応じて拡大。 CSS3とjQueryを組み合わせることで、もっといろんなことができそうですね。 数年後にはこうしたライブラリはCSS3等を応用しまくっていて、ちょっとソース見ただけだとどうやって実装しているか、よく分からないなんていう状態になっていそうな気がします 関連エントリ PCでもスマホでもスワ
画像を矩形以外の形状で表示したい人のためのチュートリアル
画像にPNGマスクを使用して、ブラシストローク状、サークル状など、矩形とは異なる形状で表示するチュートリアルを紹介します。 デモページ もう一つのサークル状のデモは、下記ページのギャラリーのサムネイルとして使用されています。 Roundfolio 画像の枚数が少ないのであれば個別に画像を作成してもよいかもしれませんが、このデモのように数多くあると、このテクニックを使用した方がより効率よく実装できます。 [ad#ad-2] 画像の作り方 画像は3種類が必要で、全て同じサイズにします。 ロールオーバー用の画像 ※透過PNG画像 マスク用の画像 ※透過PNG画像 ベースとなる画像 サークル状に使用する画像3種類 制作：HTML, CSS, JavaScript HTML ロールオーバーとマスク用に2つの空span要素を使用します。 <a href="images/gallery-full.jpg
img 要素に pointer-events: none; を指定すると、いろいろできなくなる。
いろいろできる画像のサンプル いろいろできない画像のサンプル いろいろできない画像のサンプルのコード HTML: <img class="img-pointer-events-none" src="enable.jpg" /> CSS: img.img-pointer-events-none { pointer-events: none; } 巷では a 要素に対する指定でのサンプルが多い pointer-events: none; ですが、img 要素に直接指定することでPC版ブラウザでは右クリックでの画像の保存やデスクトップに画像をＤ＆Ｄすることができなくなり、スマートフォン版ブラウザでは画像の長押し（長タップ）での保存やメール送信などのメニューがでなくなります。 もちろんソースを表示して画像のURLを直接参照したり、ブックマークレットなどを使えば画像を保存することはできます。そして当
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
