Apple Style Theme | Sequence - The Responsive Slider with Advanced CSS3 Transitions
Apple iPhone4 Style Theme Apple Style replicates the sliding theme used on apple.com for the Apple iPhone4 release. Frames can showcase multiple products each with a unique transition style. This theme includes controls toward the top which allow the user to pause Sequence’s autoPlay feature, navigation forwards and back between products, as well as showing an autoPlay progress bar. Touch SupportT
HTML5/JavaScriptによる電子書籍風フリップアニメーション·Turn.js MOONGIFT
Turn.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（BSD License）です。 電子書籍というとePubファイルが有名ですが、HTML5でも実現は可能です。特に紙をめくった時のようなフリップアニメーションが欲しい時にはTurn.jsを使ってみましょう。 デモです。幾つかのサンプル書籍が掲載されています。 開きました。 フリップしています。 別な書籍。マウスをもっていくと端が折れ曲がります。 こんな感じで斬新な表示も。 マガジン風の使い方もできます。 デモ動画です。 Turn.jsではめくる操作はもちろんのこと、拡大表示もサポートされています。デスクトップブラウザはもちろん、iPhone/iPadによる操作も可能です。コンテンツはAjaxによる動的取得にも対応しています。一部HTML5非対応ブラウザでも使えるようになっており、対応ブラウザはIE8からとなって
レスポンシブに最適。指定した画面幅になったらアクション実行·Breakpoints.js MOONGIFT
Breakpoints.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 レスポンシブWebデザインでサイトを作ったとしても、ちょっと見た目にこだわろうと思うとJavaScriptによる処理が必要になります。そこで使ってみたいのがBreakpoints.jsです。 デモです。最初は1024px以上と判断されています。 画面の幅を縮めました。768になったというアクションが実行されます。 480pxになった時のアクションが実行された時には768pxではなくなった時のアクションも実行されます。 320pxの時も同様です。 デモのコードです。使い方はシンプルです。 Breakpoints.jsでは指定した画面幅になった時、またはならなくなった時に応じて指定した処理を実行できます。例えば320を指定した場合は、enterBreakpoint320で320px
スマートフォン、タブレットの判別情報をHTMLに追加·Device.js MOONGIFT
Device.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 最近はスマートフォン、タブレット、デスクトップとWebブラウザごとの処理分岐が多くなっています。そのような時に都度ユーザエージェントで判別しているのでは面倒です。使ってみたいのがDevice.jsです。 iPhoneで縦の場合。デバイスの種別やOS、向きが判別できています。 横向きにすれば判定が変わります。 タブレットの場合も同様です。 HTMLソースです。htmlのクラスに追加されています。 向きを変えればhtmlのクラスがリアルタイムに変わっています。 Device.jsではOS（iOS/Android/Blackberry）、向き（縦または横）、種別（スマートフォンまたはタブレット）といった情報をHTMLタグに対して定義してくれます。これを基準にすれば処理判定がとても簡単になるでし
FancySelect » Octopus Code
A better select for discerning web developers everywhere.FancySelect is easy to use. Just target any select element on the page, and call .fancySelect() on it. If the select has an option with no value, it'll be used as a sort of placeholder text. By default, FancySelect uses native selects and styles only the trigger on iOS devices. To override this, pass an object with forceiOS set to true when
複数行のヘッダーにも対応してテーブルを見やすく·jquery-decapitate MOONGIFT
jquery-decapitateはjQuery/JavaScript製のオープンソース・ソフトウェア（2-clause BSD lisence）です。 大きなHTMLテーブルを表示していると、どのカラムが何のデータだったか分からなくなって、また上にスクロールして確認する…なんてことがあるかと思います。そんな面倒さから解放してくれるjQueryプラグインがjquery-decapitateです。 最初の表示です。この時点では普通のテーブルに見えます。 スクロールするとヘッダーが画面上部に残りました。 こちらは二つのテーブルのデモ。 ヘッダーの高さが違ってもちゃんと残ります。 レスポンシブ対応なのでスマートフォンで見た場合も分かりやすくなります。 ヘッダーが複数行であっても問題ありません。 ヘッダーが残ってくれるだけでデータの確認がとてもしやすくなります。データ操作の伴わない、一覧で表示する
Googleカレンダー風に時間を入力·Timepicker for jQuery MOONGIFT
Timepicker for jQueryはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。 Web上で入力する事が多いのが日時です。日付についてはカレンダーピッカーがありますが、時間は意外と面倒な入力を行う事が多いです。そこで使ってみたいのがGoogleカレンダー風入力を実現してくれるTimepicker for jQueryです。 基本的な使い方。クリックすると30分ごとの時間が出てきます。 現在時刻を中心にセットしてくれる設定もあります。 ある時刻からの時間を表示するデモ。1時間のミーティングなども指定しやすそうです。 ある時間を無効にする指定もできます。 時間のフォーマットは自由に設定できます。 ステップはデフォルト30分ごとですが、15分や60分も指定できます。 カレンダー入力と連携する形です。この二つで入力が随分と楽になりそうで
Sticky-Kit | jQuery plugin for sticky elements
Reference To install include jquery.sticky-kit.js after including jQuery. Usage: $("#sticky_item").stick_in_parent(); // or $("#sticky_item").stick_in_parent(options); You can pass a hash of options to configure how Sticky Kit works. The following options are accepted, each one is optional: parent — The element will be the parent of the sticky item. The dimensions of the parent control when the st
jQuery Masonryを使う際にわりと大事なimagesLoadedプラグイン | WEB SHOWZINE
WEB SHOWZINE Live as if you were to die tomorrow. Learn as if you were to live forever. jQuery Masonryを使っている場合、このメソッドの実行前に画像をすべて読み込んでおくようにしておいたほうがよかったりする。と思います。たぶん。 自分がやってみたものだと、これをしてないとSafariやChrome（webkit系ブラウザ）で、たまにボックス（タイリングさせている要素）が潰れたように重なってしまったりして表示崩れを起こしたので。 そのために利用できるのがimagesLoadedプラグインです。 jQuery Masonry – Images http://masonry.desandro.com/demos/images.html その潰れたようになってしまうという不具合を解消するには、im
prototype版LihgtboxからjQuery版Lightboxへの移行
2011.4.11 追記: 現在、画像の拡大表示には FancyBox を使っています。 この投稿が役に立つという方はかなり少数だと思いますが 検索しまくってやっと解決方法が見つかったので情報として載せておきます。 長時間検索して、「 コレだっ !!」 っていうのが見つかるとうれしいですよね。 そんな喜びをご提供したいと思いまして Lightbox 2 から jQuery lightBox plugin 0.5 へ 序章 リニューアル前に写真集のページで使っていた Lightbox (ページ全体が暗くなって中央に写真が表示されるエフェクト・右の画像参照) は WordPressプラグイン :: Lightbox2 prototype 版だったのですが、他のプラグインとの相性なのか、ちょっとヘンな動きをする時があったのでリニューアルついでに jQuery 版 Lightbox に入れ替えよう
Lightbox_me - Stupidly Simple Lightboxing - The jQuery lightbox plugin for people who know what they're doing.
What is it? Have you ever had a DOM element that you wanted lightboxed, but didn't want all the fanciness of all the lightbox-related plug-ins out there? Lightbox_me is for you. Lightbox_me is an essential tool for the jQuery developer's toolbox. Feed it a DOM element wrapped in a jQuery object and it will lightbox it for you, no muss no fuss. Features Lightbox_me handles all of those annoying edg
シンプルでも最低限な機能がついた画像スライダーJavaScript「Rhinofader」
過剰な画像スライダーまたは画像ギャラリーはいらない。 再生して、コントローラーを表示して、時間を指定できればいい。 そんな人にお勧めRhinofader: A simple jQuery fade sliderです。 sponsors 使用方法 Rhinofader: A simple jQuery fade sliderからファイルをダウンロード。 <link rel="stylesheet" type="text/css" href="rhino-slider.css" /> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="rhinofader.min.js"></script> <script> $(function(){ $(
jQueryで使えるけどCSSでは使えないセレクター。（CSS おれおれ Advent Calendar 2012 – 13日目） | Ginpen.com
CSS おれおれ Advent Calendar 2012 – 13日目 今日はちょいと視点を変えて見ました。 jQueryの特徴的な機能として「CSSのセレクターを使って要素を検索できる」というのがあります。 ただしjQueryでは独自に拡張してCSS本来のセレクターよりも強力だったりします。逆にjQueryを普段から使っていてたまにCSSを書こうとすると迷う場面もありそうです。 というわけで、jQueryが独自に拡張しているセレクター一覧です。（属性非同値セレクター以外は全部疑似セレクターですね。） 全般 [name!="value"] Attribute Not Equal Selector [name!=”value”] – jQuery API 属性が指定の値でないものを検索します。 .not('[name="value"]')の方が高速です。 意外とこれCSSにないんですよね。
レスポンシブWeb制作で話題のjQuery Masonryを試してみた - 青春B■雑記blog‐青酸カリ カラメルシロップ味‐
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>jQuery Masonry Sample 1</title> <link rel="stylesheet" href="css/sample.css" type="text/css" media="all"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type='text/javascript' src='js/jquery.masonry.min.js'></script> <script type='text/javascript' src='js/sample.js'></script
離婚回避マニュアルを購入したいと思っているなら・・・ ｜ 口コミ・レビュー投稿 E-BOOKデータベース
離婚回避マニュアルを購入しようとしているなら、こちらのリンクをよく確認したほうがいいです。 このWEBサイトで、女性が書いた男性のための離婚回避マニュアル～妻と絶対に離婚したくないあなたへ～の購入によって一体何ができるのかを、よく理解してから購入されることをおすすめします。 また、レビューや口コミが掲載されていれば、それもよく確認しましょう。 次の女性が書いた男性のための離婚回避マニュアル～妻と絶対に離婚したくないあなたへ～に関した情報も購入の参考になるかもしれません。 販売商品名称：女性が書いた男性のための離婚回避マニュアル～妻と絶対に離婚したくないあなたへ～ 教材説明：画期的な究極の離婚回避マニュアルをご紹介します。絶対に離婚したくない夫に徹底的な女性目線でお伝えする、離婚回避バイブルです。市販のマニュアルの多くは、男性が男性目線で書いたものであり、「妻の感情」をまったく無視しています
jQuery.lightpop.js - dogmap.jp
オプションの設定 オプションを設定することで、フレーム枠の見た目を変更したりできます。 オプションは、ざっと次の通り。 通常のオプション overlayBgColor: オーバーレイの背景色 overlayOpacity: オーバーレイの透明度 contentFrameType: 'border' (通常) or 'box' (画像を使用してフレームを表示) contentBgColor: コンテンツの背景色 containerBorderSize: コンテンツの脇に表示する空白の幅を px で指定 containerResizeSpeed: リサイズアニメーション時のスピードを数値で指定 imageLoading: 読み込み中に表示する画像ファイルのパス imageBtnClose: 「閉じる」ボタン用の画像ファイルのパス imageBtnPrev: 「前へ」ボタン用の画像ファイルのパス
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
GMapV3 - jQuery plugin for Google Map API ver.3 | Dev. GrAFR
GitHub - nathansearles/slidesjs: SlidesJS is obsolete and no longer maintained.
http://www.designwalker.com/2010/06/jquery-forms.html
