スムーズスクロールするやつ作りなおした。 APIコール時、コールバックを受け取るのをやめてdeferredを返すようにしたかったのでそのようにし、ごちゃごちゃになってたのを整理した。 GitHub - Takazudo / jQuery.tinyscrollerデモBasicLiveEventsAPI callAPI call - stopDeferredOptionsdeferredでやりとりすると、コールバック設定しまくらないといけないのが防げて便利
While CSS3 allows us to rotate letters, it is quite complicated to arrange each letter along a curved path. Arctext.js is a jQuery plugin that let’s you do exactly that. Based on Lettering.js, it calculates the right rotation of each letter and distributes the letters equally across the imaginary arc of the given radius. While CSS3 allows us to rotate letters, it is quite complicated to arrange ea
超定番のjQueryのプラグインを厳選して集めました。 商用利用が可能なものを優先的にピックアップしています。 (利用する際はそれぞれライセンスをご確認くださいね) 超定番プラグイン アニメーションのイージングを簡単に扱えるプラグイン jQuery.easing jQuery.easing
作成:2015/04/6 更新:2016/06/29 Web制作 > トレンドとなりつつある視覚効果や、細部にちょっとした動きを取り入れたいときに使えるjQuery プラグインをまとめました。ユーザーが使いやすくなるよう、ページにひと工夫したいときに。少し前のプラグインもありますが、今から使えそうなものもピックアップ。 エンジニア速報は Twitter の@commteで配信しています。 もくじ マイクロインタラクション 1.粘性 2.移動するプレースホルダー 3.滑らかにページ移動させる 4.パスワード強度を可視化 5.オートコンプリート 6.テキスト入力 7.Google Map(吹き出し・マーカー) 8.オートページャー 9.プログレス12パターン 10.ノーティフィケーション レタリング 11.1文字ごとに指定 フルスクリーン 12.モーダルウィンドウ(全画面) 13.フォーム(全
slick - the last carousel you'll ever need レスポンシブデザインにも対応した多機能カルーセル実装jQueryプラグイン「slick」 amazonの関連アイテム、などでも使われているカルーセルがレスポンシブ対応かつ、豊富な機能がついていて、便利に使えそう カスタマイズ性が高いのも特徴のようです。 関連エントリ レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「VenoBox」 レスポンシブサイト用レイアウトフレームワーク「Grid」 レスポンシブなギャラリー構築ができるLightBox実装jQueryプラグイン「lightGallery」 画像表示をレスポンシブ対応にするjQueryプラグイン「Data Img」 レスポンシブでタッチフレンドリな軽量LightBox実装jQueryプラグイン「Image Lightbox」
星の数ほどあるたくさんのjQueryのプラグインから、目的にあったものを探すのはなかなか大変ですよね。そんな時に役立つ便利なサイトをまとめました。 まずは手前ミソで自分がまとめたものから。 これは本当に多大な労力と実際の動作確認もしているので自信をもってオススメできます。 jQueryのプラグイン100選 -2013年総集編 日々チェックしているスクリプトから厳選して一年単位でjQueryのプラグインをカテゴリごとに選出しています。プラグインの半分近くは個別に記事も書いてあります。 jQueryのプラグイン100選 -2012年総集編 jQueryのプラグイン100選 -2011年総集編 jQueryのプラグイン100選 -2010年総集編 jQueryのプラグイン100選 -2009年総集編 jQueryのプラグイン100選 -2008年総集編
TOP > javascript , WebDesign > パララックス効果を与えてくれるjQueryプラグイン「7 Useful Parallax jQuery Plugins」 2013年のWEBでは大きく活躍していたパララックス効果。視差効果によってもたらされる体験は、今までのWEBとはまた違った感覚を与えてくれました。今回紹介するのはそんなパララックス効果を簡単に利用できるプラグインをまとめたエントリー「7 Useful Parallax jQuery Plugins」です。 7 Useful Parallax jQuery Plugins 手前と奥にオブジェクトを設置し、遠近感を持たせて画面に奥行きをもたせるものから、スクロールによって背景と手前のオブジェクトを動かす定番のものまで様々なパララックス効果を得られるjQueryプラグインが紹介されています。今日はその中から
fullPage.js ポートフォリオや企業のプロモーションでもよく見かける1ページで構成されたサイトで、フルスクリーンの垂直スクロール、そして水平のスライドにも対応したウェブサイトを作るためのスクリプト。 こういう作りは特にタブレットで操作がしやすいですね。 FancyScroll.js スマフォやタブレットのようにページの終わりまでスクロールした際にバウンドするのをはじめ、ちょっと面白いさまざまなエフェクトをスクロールに与えるスクリプト。
Lightbox・モーダルウインドウ関連 / Bootbox.js / Bootstrap-modal他...全17件
作成:2013/07/1 更新:2014/11/01 Web制作 > 先日ECサイトを制作したときに、動きのあるサイトにしないといけなかったので、色々調べて組み込んでみたんですが、jQueryでもう何でも出来ちゃいますね。近い将来ローカルで画像なんかを編集しなくても、ブラウザだけで色々できるようになるんじゃないでしょうか。今回は定番からちょっとマイナー(Google Analytics関係とか)なものまでjQueryの小技、プラグインを集めさせていただきました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スクロール 1.ページ内リンク/フッターまわり/トップに戻る 2.パララックス スライド 3.カルーセル 4.レスポンシブなスライダー 5.ヌルヌルサクサクなスライドメニュー 6.サムネイル付きクロスフェードスライドショー 補助 7.Google Ana
写真の拡大やギャラリーページなどに良く利用される... / レスポンシブデザイン対応Lightboxプラグイ... / Swipebox | A touchable j...他...全12件 写真の拡大やギャラリーページなどに良く利用されるプラグイン。近年のサイト制作で使わないことがない最もポピュラーなプラグインです。 最近ではスマートフォン対応の有料プラグインも続々登場。さらに便利に使いやすく進化してはいますが、商用だと有料化が進んで、以前に比べると無料のプラグインを見つけ辛くなりました。 そこで、ここでは最近のフリーで使えて商用利用可能なLightboxプラグインをご紹介いたします。
スムーススクロール・タブ切り替え・ロールオーバー・アコーディオンなどといった、サイト制作時によく使われる機能をまとめて実装することができるjQueryプラグインのまとめです。 予め使用する機能がはっきりわかっていれば、こういった便利なものを使用することでファイルの散乱も防げますし、管理もしやすくなりますね。 紹介するプラグインの中には必要な機能だけを選択してダウンロードできたりもします。 yuga.js web制作を優雅にするために作られたjQueryプラグインで、7種類の機能が実装されています。 ライセンスはMIT Licenseで、ライセンスに従う限り許可なく自由に使用できるそうです。 機能 ロールオーバー 現在のページをハイライト表示 外部リンクを別ウインドウで開く 画像をthickboxで表示(thickbox.jsを使用) スムーススクロール タブ機能 CSS3の擬似クラスをクラ
米OTOYとMozillaは5月3日、JavaScriptライブラリ「ORBX.js」を発表した。Webブラウザ上でプラグインなしにストリーミング動画を表示可能にするもので、ビデオ配信や仮想デスクトップに接続するためのリモートデスクトップクライアントといった用途で利用できるという。 OTOYはクラウドストリーミング技術などを開発するベンチャー企業。ORBX.jsは同社がMozillaとの協業を通じて作成したJavaScriptライブラリで、Webブラウザ上でGPUハードウェアアクセラレーションを利用可能にするWebGL技術を使用している。これにより、プラグインなどのブラウザ拡張を利用せずにWebブラウザ内で動画コンテンツをストリーミング方式で再生することが可能になる。Firefox、Chrome、Opera、Safari、Internet Explorer 10などに対応、モバイルでもデス
どうもこんばんは。Toshikuraです。今回のTipsは【レスポンシブデザインにも対応した高性能なスライダー【bxslider】の設置】です。以前TIPSにて【jQuery 簡単かつ高性能なスライダー【bxslider】の設置】という記事を書きました。本家の方ではレスポンシブデザインに対応したスライダーへバージョンアップされていましたので、追記版としてメモしておきたいと思いました。スマートフォンでも問題なく表示されるのは嬉しいです。スライドの動きもCSS3を使用している為とてもスムーズです。 設置方法 > DEMO > DOWLOAD 設置方法は変わらずシンプルです。プラグインを読み込みdivやliの階層を書くだけです。 プラグインのダウンロードは本家サイトより行えます。 対応ブラウザ Firefox, Chrome, Safari, iOS, Android, IE7+ 読み込
2012年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年目立ったのは、やはりレスポンシブ、そしてCSS3アニメーションでしょうか。 スライダーやギャラリー系もレスポンシブ・アニメーション対応、ナビゲーションやPinterst風のレイアウトなど、多くのプラグインにそれら二つの要素が組み合わさっています。 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 ナビゲーション関連 レイアウト関連 レスポンシブ関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
僕は人の名前を覚えるのが苦手です。それはさておき、jQueryプラグインの作成方法について頻繁に忘れるので、手順をここにまとめておくことにします。コレさえ読めば急にプラグインを大量に作れといった無茶ぶりをされても大丈夫。 多い日も安心♪(ゝω・)vキャピ はじめに - jQuery プラグインの構成 細かい差はあれど、基本的にjQueryプラグインは以下のような構成で成り立っています。 // 匿名関数で全体をラップ - (5) (function($) { // このプラグインの名前 - (1) $.fn.name_space = function() { //要素を退避 - (2) var elements = this; // 要素をひとつずつ処理 - (3) elements.each(function() { // 具体的な処理をここに記述 }); // method chain
IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 2012年10月09日- ResponsiveIframes.js IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 ページ内や画像をレスポンシブ対応にするものはありますが、ページ内に貼りつけたiframeでさえもブラウザサイズに応じて伸縮させることができます。 単にiframeのサイズを変えるだけじゃなくてiframeの中身のサイズも変えなくてはいけないため、結構大変そうですがライブラリで簡単に対応できそうですね 関連エントリ ブロック要素の高さを簡単に揃えられるjQueryプラグイン「equalize.js」 Gmailスタイルのemoticonを実装できるjQueryプラグイン クリックで水滴を落としたようにアニメーションさ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く