jQuery | CSSファイルを読み込んでheadに追加する方法 | 1 NOTES
jQueryを利用して動的にCSSファイルを読み込んでheadに追加する方法です。 他にも色々と方法はありますが、ぱっと見わかりやすいコードをひとつ紹介しておきます。 jQueryでCSSファイルを読み込んでheadに追加する方法$.get()で読み込んだCSSファイルの中身を#add-cssを指定したhead内のstyleタグの中に挿入する方法です。 <head>内に以下のHTMLを追加しておきます。 <style type="text/css" id="add-css"></stle>CSSを追加するjQueryコードは以下のようになります。 $.get("CSSファイルのURL", function (data) { $('#add-css').html(data); })注意点としては、逆にCSSの適用を解除するのにスクリプトで#add-cssの中身を削除しても、反映したCSSは解
jQuery | 文字列の前方一致や後方一致を判別する方法 | 1 NOTES
jQueryで文字列の前方一致や後方一致を判別する方法です。 判別にはJavaScriptのstartsWith()を使って前方一致、後方一致にはendsWith()を利用しています。 startsWith()とendsWith()はECMAScript 2015から追加されたメゾッドで、古いブラウザでは未対応の可能性がありますが、現行主流ブラウザではIE以外対応済みとなっています。 文字列の前方一致判別JavaScriptのstartsWith()関数を利用した文字列の前方一致判別の動作サンプルとサンプルコードです。 startsWith()は対象文字列の先頭から判別文字と一致するかどうか判別して、一致すれば「true」不一致であれば「false」を返します。 startsWith()はマルチバイト文字での前方一致判別にも対応しています。 また、第2引数を指定する事で判別する文字列の開始
React.js/jQuery 対応の JavaScript で文字列中の URL をリンクに変換するプラグイン Linkify
フロントエンドを JavaScript で記述する際、テキスト中にある URL をリンクに変換したい、という事は多いだろう。 しかし、URL の文字列をリンクに変換するというのは結構面倒だ。ググると正規表現で置換する方法が出て来るが、URL の正規表現は非常に複雑である上に、ユーザーが投稿するような Web アプリでは XSS の元にもなる。 何か良い方法は無いかと探してみた所、Linkify というプラグインを利用すると簡単にテキスト中の URL をリンクへ変換する事ができたので紹介しよう。 http://soapbox.github.io/linkifyjs/ このプラグインは単体で使う事もできるし、jQuery のプラグインや React.js のコンポーネント形式で利用する事もできる。 Linkify のインストール方法 Linkify のインストールは環境や利用する機能によって異
360度 ローテーションプラグイン「8 Best jQuery 360 Degree Image Rotation Plugins」
TOP > Tool > 360度 ローテーションプラグイン「8 Best jQuery 360 Degree Image Rotation Plugins」 私たちがWebサイトから何か情報を得る時に欠かせないのは、商品や記事の詳細を知ることができる写真ではないでしょうか。そんな写真を見せる演出に利用したい、360度回転するローテーションプラグイン「8 Best jQuery 360 Degree Image Rotation Plugins」を今回は紹介したいと思います。 360 Javascript viewer, 360 degrees JQuery image viewer 見せたいものの全景がぐるっと確認できる、リアルで見ることができない商品の全体像をブラウザ上で効果的に見せられるプラグインが紹介されています。 詳しくは以下 スワイプさせることで360度に広がるパノラマ
画像上に注釈を入れられるレスポンシブなjQueryプラグイン「Scalize」:phpspot開発日誌
Scalize - jQuery Point Scale 画像上に注釈を入れられるレスポンシブなjQueryプラグイン「Scalize」 画像上のポイントをタップするとポップアップが出て、次のように表示できます。レスポンシブなのが特徴 関連エントリ シンプルなタイマーを実装できる「jquery-tinytimer」 レスポンシブに使えるメガメニュー実装jQuery「SmartMenu」 複雑な形で進捗表示できる「jQuery-svg-progress」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
一番しっくりきたハンバーガーメニューサンプル（Jquery）
フェードアウトからフェードインを繋げて実行するサンプル
$.when().done()による同期処理のサンプル
ECサイトなどに使える画像のカーソル部分ズームjQueryプラグイン「xZoom」:phpspot開発日誌
スムーズなページ内ジャンプの実装サンプル
ON/OFFボタンの画像切り替え処理サンプル
JqueryのslideToggle()で作った簡単なスライドパネルのサンプル