幅と高さを指定したbxSliderのスライドで画像をド真ん中に表示する方法 - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
jQuery リファレンス：removeClass
索引 ├ リファレンス目次 ├ アルファベット順 └ 検索 Core：コアとなる仕組み ├ 目次 ├ jQuery(selector) ├ jQuery(html) ├ jQuery(function) ├ jQuery.holdReady() ├ jQuery.noConflict() └ jQuery.sub() 他ページ参照 └ jQuery.when() Selectors：セレクタ └ 目次 基礎 ├ *（すべて） ├ element（html要素） ├ #id名（ID属性） ├ .class名（clas属性） ├ 複数のセレクタ(and) └ 複数のセレクタ(or) 階層関連 ├ 先祖 子孫 ├ >（子要素） ├ +（直近の後要素） └ ~（後要素） 属性 ├ [属性名] ├ [属性名='値'] ├ [属性名!='値'] ├ [属性名^='値'] ├ [属性名$='値'] ├
2016年総まとめ、JavaScriptのライブラリやjQueryのプラグイン100+α選
毎年恒例のJavaScriptのライブラリやjQueryのプラグインの総まとめを紹介します。 今年リリースされたものから、アップデートされたものまで、これからのWebページやスマホページの制作に役立つJavaScriptを100+αまとめました。 KUTE.js クロスブラウザ対応のさまざまなアニメーション、2Dと3Dの変形、SVGの変形、CSSのプロパティ値の変化、SVGのモーフィング、SVGの描画などネイティブのJavaScriptでアニメーションを実現する軽量スクリプト。 デモページ Choreographer-js 「choreographer」は振り付けという意味、CSSアニメーションのさまざまな動き・振る舞いを簡単に設定できます。 デモページ Barba.js 通常のリンクのアクションによるハードリフレッシュをなくし、HTTPリクエストと描画を最小限に抑え、更にエフェクトを加え
[jQuery] Enterキーでフォーカスを移動するには
Enterキーでフォームを送信したくない時は あるWebアプリケーションのフォームで、Enterキーを押してもSubmitされない様にする必要があって、ちょっと調べた。 リターン（Enterキー）でフォームを送信しない方法: 小粋空間 とりあえずこの記事の「４．押されたキーを判定して抑止する」の所に書いてある方法で対応出来た。 Enterキーで次のフィールドにフォーカスを移動するには 次に、どうせならEnterキーで次のフィールドにフォーカスを自動で移動させたいな～、という事になった。やってみたら、jQueryのおかげでこんな感じで割りと簡単に出来た。 Enterキーが押された時にfalseを返すのではなくて e.preventDefault() を使う様に変えた。その理由はこちらを参照。 Shift＋Enterキーにも対応するには さらについでにShift+Enterキーでの逆順の移動に
Webページの印刷プレビューを見やすく素早く表示させるjQueryプラグイン・Print Preview - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Webページの印刷プレビューを、 その場で見やすく素早く表示 させるjQueryプラグインです。 地味だけど結構良かったです。 IEには対応して無い様ですが、 印刷が必要なページに導入する と良いユーザービリティになるかも。 この手のライブラリは個人的に初見だったので備忘録的にご紹介します。 このようにその場で直ぐにプレビューを表示させる事が出来ます。プラグインを導入すると、プレビュー用のボタンが指定した箇所に表示されます。また、ショートカット（WinならCtrl+P）でも同じエフェクトでプレビューが表示されます。 通常のブラウザの機能の印刷プレビューでも確認したところ、確かに別途用意したprint.cssを読み込んでくれているようでした。 ご覧いただいたほうが早そ
Google Chromeでの window.open() の動作の違い - 風柳メモ
Google Chromeで(URLのみ指定で)window.open()を実行したとき、別タブで開く場合と、別ウィンドウが開く場合がある。 バージョン 33.0.1750.154 mで確認 サンプル Google Chrome： window.open() の動作の違い 条件 試してみて分かったことは、 jQuery.get() 等の、XMLHttpRequest を使用していると思われる処理の、(onreadystatechange経由でコールされた)コールバック関数内で window.open() を呼び出すと、別ウィンドウで開いてしまう らしいということ。 コールバック関数内でも別ウィンドウでは開きたくない場合 jQuery.get() 等を呼び出す前に、予め window.open('about:blank') をコールしておき、返された子ウィンドウの window オブジェクト
Lazy Load(画像の遅延読み込み)を実装する方法
レイジーロード(遅延読み込み)とは、その名の通り、画像を遅れて読み込ませるテクニックのことです。具体的には、ユーザーがスクロールをして、目的の画像が画面内に映るタイミングで、初めて読み込みを実行します。「遅れて」というよりは、「適切なタイミングで」と言った方が正確でしょうか。さて、このことはどのような意味を持つでしょうか？ 転送量の節約ユーザーは訪れたページの全てを見るわけではありません。あなたにも、あるページを訪問して「やっぱ止めた」とすぐに戻るボタンをクリックして帰った経験はありますよね。基本的に、ブラウザは訪れた時点で、ページの全ての画像を読み込みます。 このページに、仮に100枚の画像が掲載されていたとしたらどうでしょうか。ちょこっと訪問されるだけで、毎回、見られてもいない大量の画像の転送が発生してしまいます。余計な転送が発生することで、運営者側にとってはサーバーコストが増える、閲
ファイルアップ時に進捗を表示する方法 | ScrapEngineer
ファイルアップ時に進捗を表示する方法を紹介致します。 UI的にかっこ良くなりますし、ファイルのアップロード状況がわかるのはとっても嬉しいですね 以前の記事の2つを応用した方法で可能となります。 ドラッグ & ドロップでファイルをアップロードする方法 HTML5 進捗状況を表示するプログレスバーを使ってみる 下の画像が完成した機能です。 HTML5 進捗状況を表示するプログレスバーを使ってみるから変更点があるのはJavascript、HTML側。 ちょこちょこ変わっていますが重要なところをハイライトにしています。 Javascript HTMLサンプル <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ファイルのアップロード</title> <script src="http://ajax.googleapis.com/a
エラー箇所など指定した要素にスクロールで移動する
photo by mollyali 縦長Webページの入力フォームなどで、バリデーション後にエラーを表示したいことがある。その方法はいくつもあるが、今回はエラー箇所にスクロールで移動する方法を実装する。 ※サンプルではjQueryを使用しているが、使わなくても対応可能（アニメーションが面倒だけど） 特定の要素にスクロールで移動する var position = $('セレクタ').get(0).offsetTop; $('body').animate({scrollTop: position}, 'slow'); 要素の位置を取得するには $('セレクタ').get(0).offsetTop を使う。 $('セレクタ').offset().top で位置を取得するとズレる場合があるので注意。 また、複数ある要素のうち1番目に移動したい場合は、 $(‘セレクタ:first’).get(0).
BeautyTips Demo Page
BeautyTips is a jQuery tooltips plugin which uses the canvas drawing element in the HTML5 spec to dynamically draw tooltips (sometimes called "talk bubbles" or "help balloons") associated with a html element on the page. These tips are highly configurable and can be triggered in many different ways. The canvas element is supported in modern versions of FireFox, Safari, and Opera. However, Internet
jQuery deferredの使い方 | 前編 deferredの基本
jQuery deferredの使い方 前編 deferredの基本 jQuery deferredをなんとなく知っているが使い方がよくわからない人のために短期シリーズでおさらいをします。第1回目は非同期処理の概念からdeferredの基本機能までをおさえます。 なぜ、今、jQuery deferred？ この短期シリーズでは、2回に分けてjQuery deferredについて解説します。 jQuery deferredは、jQuery1.5で追加された機能であり、特に新しいものではありません。 しかしながら、私が昔書いたjQuery deferredに関するブログ記事をブックマークする人が、いまだにちょこちょこいるのが見受けられるのです。 もしかして、deferredの存在はなんとなく知っているけれど、どのように使ったらいいのかよくわからないという人が多いのかもしれないと思い、改めてまと
$.post() | jQuery 1.9 日本語リファレンス | js STUDIO
$.postは$.ajaxの略記です。$.ajax関数で次のように指定した処理と同じ処理を実行します。 $.ajax({ type: 'POST', url: url, data: data, success: success, dataType: dataType }); デモ test.phpにリクエストを送信します。サーバが返す値について、処理は行いません。 $.post("test.php"); test.phpにデータをリクエスト(POST)送信します。サーバが返す値について、処理は行いません。 $.post("test.php"); test.phpに配列データをリクエスト(POST)送信します。サーバが返す値について、処理は行いません。 $.post("test.php", { 'choices[]': ["Jon", "Susan"] } ); test.phpにフォームの
jQueryでリンクをクリックさせたい時 - Qiita
javascriptから、特定のリンク要素をクリックさせたい時があるかもしれないですね。 今回その必要が生じたのは、javascriptのlocation.hrefではInternet Explorerでリファラが送信されないことが発覚したから。 本来、そのような実装は避けるべきだが、どうしても特定箇所のリンクをクリックさせたいときは下記のように書く。
Autocomplete | jQuery UI
Autocomplete Enables users to quickly find and select from a pre-populated list of values as they type, leveraging searching and filtering. The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try. The datasource is a simple JavaScript array, provided to the widget using the source
Select2 4.0.0 jQueryプラグイン 新バージョンここがすごいよ - Qiita
先日jQueryで使えるドロップダウン代替プラグイン5選でご紹介したSelect2プラグインですが、もうすぐメジャーバージョンアップを控えていて、この記事を作成している現在リリース候補版となっています。 Select2 https://select2.github.io/ ここで新バージョンがどのように改善されているのかいくつかご紹介したいと思います。 公式ドキュメントからの情報をまとめています。 コードのフルリファクタリング これまで3年間維持してきたコアのコードを全て書き直したとのこと。 ソースの見やすさやパフォーマンス向上が期待できますね。 後方互換性ももちろん持たせているそうです。 新しいプラグインフレームワーク プラグインを簡単に実装しやすくするためにアダプタシステムが用意されています。 本体に手を入れずに気軽に拡張できるのが良さそうですね。 代替input要素の排除 これまで、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQueryでクリックされた要素が何番目か取得する - Qiita
http://www.hp-stylelink.com/news/2015/02/20150217.php
http://www.hp-stylelink.com/news/2014/12/20141217.php
jQueryの基本 - $(document).ready - Qiita
jQueryで使えるドロップダウン代替プラグイン5選 - Qiita
