jQuery.extend() メソッドの使い方まとめ ｜ Tips Note by TAM
知っている人には当たり前のことかもしれませんが、使い方をまとめておきます。 jQuery.extend() は、基本的には複数のオブジェクトをマージして返してくれるメソッドです。 (プラグインのソースで、デフォルトの設定値を上書きする時などによく見かけますね） jQuery.extend(target[, object1][, objectN]) こんな感じで使います。 オブジェクト a の内容と b の内容をマージしたいとき、 var a = { id: 1, name: 'TAM' }; var b = { name: 'TAM-new', hobby: 'football' }; $.extend(a, b); console.log(a); // 結果: // { // id: 1, // name: "TAM-new", // hobby: "football" // } $.e
vue.jsでjQuery UI Sortableを使う - Qiita
<div id="ex-sortable"> <ul v-component="v-sortable" v-with="model: list"></ul> </div> <template id="sort-template"> <li v-repeat="model">{{$value}}</li> </template> Vue.component('v-sortable', { template: "#sort-template", ready: function() { var self = this; $(this.$el).sortable({ opacity: 0.6, start: function(e, ui) { ui.item.data('from', ui.item.index()); }, update: function(e, ui) { var from =
[JS]スマホ・タブレットでの操作性を重視したタッチデバイス対応のさまざまなスライダーを実装できるスクリプト -Swiper
iOS/Androidなど、モバイル向けのWebサイト、Webアプリ、ネイティブアプリでの利用に最適化されたタッチデバイス対応のスライダーを実装できるスクリプトを紹介します。 キーボード操作やマウスのホイール・ドラッグ操作にも対応しているので、デスクトップでもOK！ Swiper Swiper -GitHub Swiperの特徴 Swiperのデモ Swiperの使い方 Swiperの特徴 ライブラリに依存しない Swiperは他のスクリプトのライブラリに依存せず、軽量で速く動作するスクリプトです。 jQuery, Zetro, jQuery Mibileなどの他のライブラリと一緒に使う時も安全です。 タッチの動きをそのまま デフォルトの設定でタッチの動きを「1:1」でインタラクションとして提供できます。 豊富なオプション ページネーション・ナビゲーションボタン・パララックスエフェクトなど
![[JS]スマホ・タブレットでの操作性を重視したタッチデバイス対応のさまざまなスライダーを実装できるスクリプト -Swiper](https://cdn-ak-scissors.b.st-hatena.com/image/square/8a511277683e71470e97dcc87cbe8649476d701d/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201501%2F2015030201.png)
jqPlotで簡単でリッチなグラフを作成 - Taste of Tech Topics
こんにちは、fujiiです。 今回は、jqPlotというJavaScriptのライブラリを紹介したいと思います。 jqPlotとは? jqPlotとは、JavaScript上で線グラフや円グラフ、棒グラフといった 様々なグラフをcanvasを利用して描くためのライブラリです。 系列の表示の有無や色の変更といった基本的な操作から、 ズームやハイライトといったオプションも提供しているため、 リッチなUIでグラフを表現できることができます。 IE7、IE8、Firefox、Safari、Operaと幅広いブラウザをサポートしているので、 利用環境の制約も少ないです。 準備 まずは、jqPlotのページに行き、ダウンロードしてみましょう。 ヘッダ部のdownloadリンクを選択すると、 sample_jqplot1.zip ダウンロードページに移動します。 ダウンロードしたいバージョンのファイルを
jQuery の jqPlot プラグインで作るローソク足（ローソクチャート）
<script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script> <!--[if lt IE 9]> <script language="javascript" type="text/javascript" src="excanvas.min.js"></script> <![endif]--> <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script> <script language="javascript" type="text/javascript" src="plugins/jqplot.dateAxisRenderer.min.js"></scrip
ローソク足を表示するjQueryプラグイン「jqCandleChart」 - uraitoのいまだにブログ名が未定のブログ
作ったのはだいぶ前な気がしますが、jqCandleChartというjQueryプラグインを書いたので紹介します。 何をするもの？ 使い方 1) プラグインの読み込みとHTMLの準備 ソースをgithubのリポジトリからダウンロードし、その他jQueryのプラグインと同様に読み込んでください。表示にはjquery.candlechart.jsのみ利用します。その他のファイルは説明やテスト用ですので不要です。 <script src="jquery.js" type="text/javascript"></script> <script src="jquery.candlechart.js" type="text/javascript"></script> また、描画用のcanvasをHTML上に準備します。 <canvas width="400" height="300" id="cv01"
jQuery の jqPlot プラグインで作るローソク足の陽線と陰線の色を指定
jQueryのjqPlotプラグインで作るローソク足（ローソクチャート）において、始値よりも終値が高い陽線のときの色と、始値よりも終値が安い陰線のときの色を、それぞれ指定する方法。 実装例（サンプル） <script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script> <!--[if lt IE 9]> <script language="javascript" type="text/javascript" src="excanvas.min.js"></script> <![endif]--> <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script> <scr
ローソク足チャート「jqPlot」
「ローソク足チャート」は株価の4本値を表示するグラフでよく使われるグラフです。 一つのプロットでOHLC(Open, High, Low, Close) それぞれ、Openは始値、Highは高値、Lowは安値、Closeは終値になります。 サンプル スクリプト <!-- グラフ表示に必要なスクリプト --> <script src="jquery.min.js" type="text/javascript"></script> <link href= "jquery.jqplot.min.css" type="text/css" rel="stylesheet"> <script src="jquery.jqplot.min.js" type="text/javascript"></script> <script src="excanvas.min.js" type="text/javas
jquery.cookie.jsが便利 | NeGiMeMo.net
bell賞味期限切れコンテンツ この記事は公開または最終更新から1067日くらい経過しています。 このメッセージが表示されている記事（特にプログラミング系）は情報が古くなっている可能性があるので注意して下さい。 公官庁のウェブサイトなどでよく見かける、文字サイズを変更するスクリプト。 コード自体は昔それっぽい記事を書きましたのでその時に使ったのと似たような方法で実装する予定ですが、そのスクリプトだけだとページを遷移した場合、設定が初期状態に戻ってしまいます。 大抵の場合文字サイズを大きくして読み始めた人は他のページでも大きな文字で読むでしょうから、これでは不便ですよね。 そこで、cookie等を利用してブラウザごとに文字サイズの設定を記憶させる必要があります。 cookieを利用する方法はいくつかあるようなのですが、今回は jquery.cookie.js というjQueryから操作できる
テーブルをソートできるようにするjsライブラリ-table sorting
テーブルをソートできるようにするjsライブラリ-table sorting Check Tweet 配布元：Table sorting JavaScript ライセンス：MIT license バグ修正&日本語対応版 配布元：to-R[とあるWebクリエイターのblog] table sortingはテーブルをソートできるようにするjsライブラリです。 テーブルの内容でソートしたり、奇数行、偶数行にそれぞれ異なるclassをつけたりが可能です。 設置方法 ダウンロードしたsortable.jsをhead要素内なので読み込みます。 <script type="text/javascript" src="sortable.js"></script> ソートの対象のtable要素のclass属性をsortableに設定して、任意のID名をid属性につけます。 <table class="sort
jQuery UI 1.10 日本語リファレンス | js STUDIO
このサイトについて jQuery UIの日本語リファレンスです。 jQuery UIの本家サイト(英文) の内容を翻訳して作成していますが、誤訳や誤記があると思いますのでその点についてはご了承ください。 もし、誤訳などの間違いを見つけましたら、 @tomof まで教えていただければ幸いです。 このリファレンスではjQuery UIのバージョンは1.8以上を対象としていますので、それ以前のバージョンについては当てはまらない 箇所もあると思いますので注意してください。 また、1.8以降のバージョンによる違いについて、なるべく記述しているようにはしていますが、内部処理やclass名の変更等、全ては書ききれてはいないので、 詳細について知りたい場合は公式サイトでの確認をお願いします。 jQuery UI 1.9アップグレードガイド(英文) jQuery UI 1.10アップグレードガイド(英文)
iPhoneやiPadでドラッグやリサイズ可能なコンテンツを容易に実装出来る・jQuery.ui.touch-punch.js - かちびと.net
iPhoneやiPadのタッチイベントに 対応させるjQueryプラグインです。 軽量なんですが、jQueryUI併用な ので一応軽量とは謳わないように しておきます。導入も結構簡単 なので覚えておいて損は無いかも。 iPhoneやiPadでドラッグやリサイズを可能にするライブラリです。もちろんiPhoneだけでなく、PC側でも動かせます。 ただ、要素をドラッグしたりリサイズしたり、だけではなくドラッグ可能なコンテンツをネストしたりドラッグコンテンツ内にスライダー入れたりとかも出来る。 試しにjQueryMobileと併用しました。サンプルどうぞ。QRコードも用意しときました。 sample 使い方 <script src="http://code.jquery.com/jquery-1.7.0.min.js"></script> <script src="http://code.jque
[JS]画像やコンテンツを水平・垂直に気持ちよくスクロールさせて表示することにこだわったスクリプト -Sly
水平・垂直に配置した画像やコンテンツを気持ちよくスクロールさせることと次に表示するアイテムのロジックにこだわったjQueryのプラグインを紹介します。 IE6にも対応してるのがびっくりです！ 特徴は気持ちのいいスクロールだけでなく、ナビゲーションのロジックも直観的で、次に表示するべきアイテムを自動的に先頭に配置します。クリックでアクティブにしたアイテムも常に保持します。 操作は上部のバー、FRAME上でホイール、パネルのクリック、下部のナビゲーションがあり、また下部のボタンでは前・次、最初・最後・中央などの操作もできます。 ナビゲーションでの操作は次に表示するアイテムを先頭に配置します。 デモでは、水平方向のスクロールだけでなく、垂直方向、無限スクロールもあります。
Twitter BootstrapでさくさくWeb開発 : アシアルブログ
新年度です！ 新入学、新入社を迎えるみなさん、おめでとうございます。 エンジニアのみなさんがWebアプリケーションを作るとき、一番悩むのはデザインではありませんか？ カッコよくって統一的なデザインがほしい！でもデザインセンスないし…実は私もそうでした。 ですが、2月にメジャーバージョンアップしたTwitter Bootstrapを使うと、簡単にカッコいいサイトが作れます！ Twitter Bootstrapとはなにか Twitter Bootstrap CSSのフレームワークです。 Web上に使ってみた！スゲー！等、たくさんのドキュメントが存在していますが、中には2月以前のバージョン(v1.4)について言及しているものもありますので、2系を使う方はバージョンの違いに気をつけて下さい（クラス名など結構ガラっと変わっています）。 今回ご説明しているのは、Twitter Bootstrap 2に
jQueryのプラグイン33+1選 -2011年9月 | コリス
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Loupe 画像の一部を拡大します、多彩なオプションが便利。 Slicebox 画像をダイナミックに3Dスライスするギャラリー。 E
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sortable | jQuery UI