タグ

CSSとLightboxに関するhoge_systemzのブックマーク (5)

  • [CSS]スクリプト無しで、クリックで画像を拡大するスタイルシート

    Lightboxなどのスクリプトを使用しないで、スタイルシートで実装する画像を拡大するテクニックをCSSplayから紹介します。 画像を拡大表示 拡大画像を消すのは、右上のアイコンです。 仕組みは簡単に説明すると、サムネイル画像と拡大画像(テキスト含む)をインライン要素として配置し、focusとactive時にdisplayやpositionなどを変更しています。 対応ブラウザは、Safari(PC), Google Chromeとのことですが、上記キャプチャはFirefox3.5です。 IE6でも動作するバージョンは「CSS Light Box - Click version」です。 このテクニックは画像ギャラリーだけでなく、商品写真の拡大などにも応用がきくものとなっています。

  • [CSS]Lightbox風エフェクトをCSSで実装する方法

    Lightbox、Thickbox風のエフェクトをJavaScript無しで、CSSで実装する方法の紹介です。 Create a Lightbox effect only with CSS - no javascript needed [Emanuele Feronato] 上記サイトで紹介されているコードを使用すると、Lightbox風のエフェクトを実装することができます。 「JavaScript無し」とサイトにはありますが、onclickのイベントに入っているので厳密に言うとJavaScript無しではありません。 簡単に実装できるので、いろいろと応用も効きそうです。 lightbox lightbox 2 thickbox GreyBox

  • グレーアウト表示ライブラリ:glayer.js:phpspot開発日誌

    glayer.js - グレーアウト表示ライブラリ Lightbox.jsや、Livedoor Readerのフィード追加画面のような、背景全体をグレーアウト表示させるためのライブラリです。(grey+layerで、glayer.js) グレーアウト表示ライブラリ:glayer.js。 LightBoxのように、画面全体を簡単にグレーアウトすることが出来ます。 使い方は、必要なJavaScriptCSSを読み込ませて、divを定義した後、onclickイベントハンドラなどに、 Layer.show( divのid要素 ) Layer.hide( divのid要素 ) を仕込むだけで簡単に使えて便利です。 このライブラリを使って、ポップアップメッセージをウィンドウ内で表示するサンプルを作ってみました。 <html> <!--●必要ライブラリの読み込み--> <script type="te

  • SEO業者ですら感動する驚異のCSSテクニック - 不定期更新 SEOコラム

    急にお金が必要になってしまいました。キャッシングをするのに、レイクかモビット、どっちを利用するか迷っています。借りるならどっちがお得ですか? お得という点から言えば、初めてならレイクがよりお得です まず、それぞれの特徴を見ていきましょう。レイクは銀行系で、総量規制の対象外、1万円からお借入可能で、最大500万の限度額、年率4.5~18%、200万まで30日間無利息、または5万までなら180日間無利息、初めてのお借入なら有利な条件ですね。届く封筒は「新生銀行」の名称です。 一方、モビットは消費者金融で、総量規制の対象となります。限度額は500万、年率4.8~18%です。特に無利息期間の指定はありません。WEB完結型なら、審査の電話が入りません。 最高・最低金利だけで見ると、レイクのほうがお得に見えます。また、期間無利息などの点からも、初めての方はレイクのほうがお得な印象です。 反面、新生銀行

  • Suckerfish HoverLightbox - Jon Christopher

    Update: If you’re a fan of the Suckerfish HoverLightbox, you’ll probably like the Suckerfish HoverLightbox Redux, a new and improved version. From time to time I come across some truly impressive techniques that are a great blend of CSS, XHTML, and sometimes JavaScript. Personally, I am not a big fan of implementing JavaScript, but it is sometimes unavoidable. That is usually due to circumstances

    Suckerfish HoverLightbox - Jon Christopher
  • 1