パララックスをはじめ、パスに沿ってスクロールさせたり、スクロールに合わせてパネルを表示するなど、スクロール時に面白いエフェクトを与えるjQueryのプラグインを紹介します。
パララックスをはじめ、パスに沿ってスクロールさせたり、スクロールに合わせてパネルを表示するなど、スクロール時に面白いエフェクトを与えるjQueryのプラグインを紹介します。
ページ内スクロールならコレにおまかせ!なjQueryプラグイン「Page Scroller」 2012年02月13日- Page Scroller: A Simple Page Scrolling Plugin ページ内スクロールならコレにおまかせ!なjQueryプラグイン「Page Scroller」。 ページ内を上や下に移動できるだけではなく、ページ内のマークアップを読み込んでナビゲーションを作ってくれた上でスクロールできたりもします jQueryプラグインなので、$('#main').pageScroller(); みたいに呼ぶだけです ページの左サイドにナビゲーションを表示する例 綺麗なスキンがかぶって表示されます 上下矢印のナビゲーションも可能 サイドではなく、ページトップにナビゲーションを設定することも可能 右サイドにも移動可能 なかなか便利で使えそうですね。1ページに沢山の情
Curtain.js スクロールするとカーテンが上がるようにパネルが非同期で動くページが作れるjQueryプラグイン「Curtain.js」 単なるスクロールする縦長ページではなく、スクロールするとブロック要素が別々に動いて面白い演出が作れます。 左下のナビゲーションでページ送りをしたりも出来るみたい 今なら、これを使ってサイトを作れば、玄人なWEB業界の人も目を丸くするかもしれませんね。 関連エントリ フルスクリーン背景がスライドショーになるCSS3サンプル レスポンシブなスライドショーを実装できるjQueryプラグイン「ResponsiveSlides.js」 iTunesストアのトップのスライドショー風ウィジェットを実装できるjQueryサンプル HTML5&CSS3をフルに活用したスライドショー実装ライブラリ「Slider.js」
デモページ:Super Slider スライドのスーパー版で、斜め方向のスライドで画像を切り替えます。 bgStretcherの主な特徴 セットアップはシンプル 全てのモダンブラウザをサポート 画像は一枚だけでなく、複数枚にも対応 対応ブラウザ Internet Explorer 6, 7, 8, 9 Firefox 2, 3, 4 Opera 9+ Safari Chrome bgStretcherの使い方 Step 1: ファイルのダウンロード サイトの「Download」よりファイル一式をダウンロードします。 一式には必要なファイル全て(jqeury.jsも)が含まれています。 Step 2: 外部ファイル 外部ファイルを下記のように<head>~</head>に記述します。 <script type="text/javascript" src="../jquery-1.5.2.mi
TwitterのタイムラインやFacebookのニュースフィードように、ページの一番下までスクロールしたらコンテンツを自動的に表示する「jQuery.Bottomプラグイン」を紹介します。 1.サンプル jQuery.Bottomプラグインにはデモページが用意されていますが、いまいちなのでサンプルページを作りました。 jQuery.Bottomプラグインサンプル ページの一番下までスクロールすると自動的にコンテンツを表示します。 なお、最初に表示した状態でコンテンツがすべて表示されてしまっているとそもそも動作しないので注意してください。 2.プラグインの機能 jQuery.Bottomプラグインは「bottom」イベントを登録するためのものです。このイベントを利用してページの一番下までスクロールすれば、bottomイベントが発生します。 3.プラグインのダウンロード githubのjQue
Google Analytics APIを使い、Wordpressのダッシュボードで、Google Analyticsの アクセス解析結果 が見られるプラグインです。Twitterで話題になっていましたので、早速入れてみました。 プラグインのダウンロードは以下から。 WordPress ? Analytics360 ≪ WordPress Plugins 実行環境は、Wordpress2.7以降 (ただ、私の環境、2.71ではフォルダアップロード後、プラグイン表示が一切出来なくなり Wordpressを2.82にバージョンアップしましたら、利用可能になりました・・・。 READMEにもテスト環境は2.81と書いてありました。ご注意下さい。) Wordpressの/wp-content/plugins/ディレクトリに、フォルダごとアップロードします。 プラグインメニューで「使用する」にします
ある日、Twitterで @poyosi さんがこんな事をつぶやいていて 実は内心「40も50も入れるかフツー?」などと思っていたのはおくびにも出さず聞いていると、夜中にもかかわらず各所から反応があって 意外にニーズがあるのかもと考えを改め、そんなわけで、ちょっぴり興味を持って取り組んでみることにしました。 メモの入力と表示ですが、あまり小さかったりすると入力も表示もユーザビリティーが悪くなりますし、ただでさえプラグインの説明表示の表示文字数が多くなり窮屈な感じになりそうだったのでカラムを増やすのは得策ではないと考えました。 そんなときに、ちょうど有り難かったのがプラグインの行表示を行った後に存在する after_plugin_row というフックです。プラグインの更新があった場合、 の様なメッセージが表示されますが、この表示もほぼ同じ箇所のフックを利用しているはずです。 というわけで、プ
ちょっと今更な話題なんですけど、始めて 使ってみたら便利だったのでご紹介です。 管理画面内のcssを手軽に変更できる、と いうプラグイン。よくあるブログサービス でも管理画面は簡単にデザインを変更でき るようになっていますが、それを実現する プラグインです。 手軽に、というのはプログラミングの知識が不要って意味です。このプラグインを有効化すると、cssを追記できるようになりますので、カスタマイズの知識が無くても管理画面内のデザインを変更できます。 css書くだけで管理画面のデザインを変更できます。この手のは沢山あるんですが、結局シンプルにcssで出来るのが制作者向けかなぁとは思いました。 抜粋が狭すぎるので広げてみた。あと、テーマやプラグインはいじられると困るので非表示に、みたいな感じ。 こういったカスタマイズの目的はWebに疎いクライアントさんはアクセス出来ないようにしたい、邪魔なものを
改行が改行しただけ改行したまま改行する 改行の改行による改行のためのプラグイン作ってみました。 こんなもの使う人がいるとかいないとか 文法的にどうだとかなんだとか、細かいことは気にしない。(;・∀・) ////こんなプラグイン 投稿した本文中の改行を改行しただけ改行した分<br />に変換します。 ※全体をPタグで囲むだけで本文中のpタグは入らなくなります。 ※コメントも改行しただけ改行します。 ダウンロードはこちら WordPress改行プラグイン ダウンロード (ver3.0以降) **13.1.6 ver 2.9以前への対応を終了. editor.jsの配布を終了 **10.9.15 ver 2.8以前の対応版の配布を終了 **10.1.5 ver 2.9について追加 **09.06.15 ver 2.8について追加 **09.01.29 ver2.7について追加? **08.01.
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー&カルーセルプラグイン、チャート&グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー&カルーセルプラグイン、チャート&グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
3分しか時間がない人向け WordPress の管理画面を開く WP File Cache をインストールする MO Cache をインストールする 完了!設定の必要はありません もう少し時間がある人向け この記事は WordPress Advent Calendar 2011 の10日目の記事です。 今日は MO Cache という WordPress プラグインの紹介をしたいと思います。 先日初めて WordPress を使いサイトを作成したのですが、インストール直後からのあまりの遅さにびっくりし、そりゃあチューニング記事が人気になるよなぁなんて考えていました。しかし最近になって WordPress 3.3 Beta が出たためちょっと触ってみようかなと英語版をインストールしたところ、以前日本語版 3.2.1 をインストールした時よりも明らかに速いことに気づきました。 最初はバージョン
2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
fadeMoverプラグインの解説ページを別途作成しましたので、下記ページをご覧ください。 jquery.fadeMover – Fadein and Fadeout for jQuery ——- 以下 [ 2012-02-06 ] 以前の内容です —- [ 2012-02-06 追記 ] 最近このページのアクセスがかなり増えているので、記事を見直していたら、制作途中のものを記事にしてしまっていました。もしご利用をお考えになられていても「動かない…wtf…」となっていた方がおられたと思います。。。申し訳ありません。 作成途中で「ページ内リンクの動作禁止にしないと使えないよね、これ。。。」と気がつき、機能を付け足していたんですが、公開していたものが動作確認中の途中のスクリプトでした。それが原因でアンカーにclassを指定していたらまったく動作しないようになっていました。もし古いものをご利用さ
題名の通りスクロールバーを変える jQueryプラグインです。全然使う 機会が無かったんですが、以前から 触ってみたいと思っていたところ、 ちょうど良さそうなプラグインを 見かけたので試してみました。 デザインそのものはcssでカラーリングしたり、画像に置換したり、と自由も利いて、クロスブラウザにも対応、3KB以下と軽量です。 こんな感じでデザインを変えられます。せっかく統一性をうまく出したのに仕様上スクロールバーが出てしまって一体感を損なう悲しみと絶望感はWebデザイナーさんなら経験したことがあるのではないでしょうか?え、無いの・・じゃあいらないかn Sampleまぁせっかくなので見てください。 当サイトの右上のギアアイコンを使いました。このアイコンをクリックすると回転するんですがこれはcss3のkeyframeとanimateでうごかs、あ、どうでもいいですよね。 IE6/7 IEでも
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く