Vue.js ではじめるシングルページアプリケーションの開発 - HDE BLOG
Vue.js は JavaScript フレームワークです。 ウェブアプリケーションのユーザーインターフェイス開発を支援する様々な仕組みを提供します。 管理画面はもちろん、HTMLエディタのようにユーザの入力に対して即応性が必要なアプリケーションを簡単に作ることができます。 例えば、テキストエリアに文字を入力すると、 デザインしたページの特定のDIV要素がリアルタイムに更新されるといったデータ反映の仕組みを備えています。 また、JavaScript で大規模なユーザーインターフェイスの開発を行う場合、HTMLファイルのテンプレート化、 JSファイルの依存関係、グローバル変数汚染など様々な課題に直面します。 Vue.js は、コンポーネントという仕組みと Webpack というモジュール管理ツールと組み合わせることで、 これらの課題にうまく対処できるようになっています。 今まで jQuery
JavaScript,jQueryの爆速コーディング、デバッグ方法論の勧め～実践向け逆引き(windows,chrome向け)～ - Qiita
JavaScript,jQueryの爆速コーディング、デバッグ方法論の勧め～実践向け逆引き(windows,chrome向け)～JavaScriptjQuery ※2017/4/21にオンロード時のデバッグ方法8を追記しました！ こんにちは！エイチーム引越し侍の加藤です！ みなさんJavaScript書いてますか？ console.logめっちゃ使うよねーって人は目からうろこのデバッグ方法を、 ケース毎に紹介していこうと思います。(僕はconsole.log使いません) サーバーにデバッグ用のコードをアップロードすること無いので、 消さずに意図に反してリリースしてしまう危険性がないのもお勧めです。 前提知識 F12で出てくるデベロッパーツール(Elements, Console, Source, Network)の知識 Ctrl+Shift+Fで外部ソース(js,css)に対して一括検索が
tipso
There is also a Wordpress version of this plugin. GET IT HERE Getting started 1. Include jQuery <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> Requires jQuery 1.7+ 2. Include plugin's code <link rel="stylesheet" href="/path/to/tipso.css"> <script src="/path/to/tipso.js"></script> To use css3 animation effects please include Animate.css <link rel="stylesheet" hre
You Don't Need jQuery - Qiita
注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで
ルーレット型のUIを実現できるjQueryプラグイン「rouletteWheel」:phpspot開発日誌
JavoByte/rouletteWheel GitHub ルーレット型のUIを実現できるjQueryプラグイン「rouletteWheel」 クリックするとルーレットが回転し、止まるというアナログ風UIを実現出来ます。 ルーレット停止後、選択したアイテムをコールバックで取得できます。 ありそうであまりなかった 関連エントリ 時間の選択に便利なUIを提供できる「jquery.ui.timeselect」 selectの複数選択のUIをサジェスト方式に変えるjQueryプラグイン「easySelect」 モダンなUIでかっこいいサイトが作れるDB不要のCMS「Grav」 綺麗でレスポンシブなタイムラインのUIを作成できるjQueryプラグイン「Dynamic Timeline」 イマドキなデザインのタブUIを実装できるjQueryプラグイン「PWS Tabs」 WEB、アプリにフリーで使える
ページ内リンクはスムーズスクロールしなくても一瞬点滅すればいいんじゃないかという実験
スムーズスクロール以外の方法で、ページ内リンクによって画面が切り替わったことを利用者にわかりやすく伝える方法はないかということで、ページ内リンクでの移動時に画面を一瞬点滅させるスクリプトを jQuery で書いてみました。 タイトルが （謎） な感じですが...... ページ内リンクでページ上部に移動させたりするとき、最近は所謂スムーズスクロールってやつを実装するのが当たり前になっていますよね。パッと瞬時に画面が切り替わってしまうと、ページ内で移動したことがわかりにくいので、スクロール処理を入れることでわかりやすくしてあげましょうって言う、親切心から採用されるケースが多いと思います。 実装方法は JavaScript と CSS アニメーションの組み合わせや、JavaScript （というか jQuery） でというのが多いと思いますが、今回はそのスムーズスクロールの実装方法はどれが良いの
URLに対するフェイスブックのいいね数を調べるツール。その２
/// このメモのブックマークレットはうごかなくなりました。 新しいバージョンのメモはこちら 「URLに対するフェイスブックのいいね数を調べるツール。その３」 /// どうも。kaminalyです。 以前、「URLに対するフェイスブックのいいね数を調べるツール。」 をメモったんですが、 それを改良したので、またメモっていますよ。 ブックマークレットの意味がよくわからず、 このツールを堪能できていない人も多いようですね。。。 このツールは「いいねどんだけ〜」のリンク部分を右クリックしてブックマークに保存したり、 ブックマークバーにリンクをドラックしてブックマークしたりしておいて、 いいね数を調べたいサイトをブラウザで開いた状態で、 保存しておいたブックマークを押す（開く）とアラートでお知らせするというものです。 ではどうぞ。 いいねどんだけ〜Ver2(超他力本願バージョン) こちらは、@hi
Convert form data to JavaScript object with jQuery
How do I convert all elements of my form to a JavaScript object? I'd like to have some way of automatically building a JavaScript object from my form, without having to loop over each element. I do not want a string, as returned by $('#formid').serialize();, nor do I want the map returned by $('#formid').serializeArray();
レスポンシブデザインにも対応した多機能カルーセル実装jQueryプラグイン「slick」:phpspot開発日誌
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プラグイン「Advanced News Ticker」:phpspot開発日誌
JQuery Advanced News Ticker クールなニュースティッカーを実装できるjQueryプラグイン「Advanced News Ticker」。 縦方向にカッコよくアニメーションしながら流れるニュースティッカー実装ができます。デモのデザインがいい感じ。 関連エントリ 文字をタイプしている風のニュースティッカーを実装できる「jQuery News Ticker」
pjaxできれいなURL＋非同期画面遷移！ | ヘッドウォータースのブログ TechNote
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね！ これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり！！SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました！！！ これからWebサービスを作るなら、導入したいですね！！！ これpjaxを使えば簡単に導入できるんです！！！よし！！！ PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
ccchart
Github https://github.com/toshirot/ccchart Documents 2016/11/01 Document Automatic extraction version ccchart Reference--Under construction 2013/06/06 v1.06.3 Document Doc v1.06.3 Blog [THE LAST DAY] #ccchart Recommended browser Google Chrome is the fastest for the ccchart. Bugs Bug at bar type in v1.12.03 - v1.12.05 v1.12.03 - v1.12.05 There is a bug that bar starting point position of the falls.
Bootstrapに便利な機能を追加できるjQueryプラグインまとめ
Lightbox・モーダルウインドウ関連 / Bootbox.js / Bootstrap-modal他...全17件
コールバック……駆逐してやる…この世から…一匹…残らず!! - Qiita
このテキストは JavaScript のコールバック地獄に疲れたひとのためのコールバック駆逐術指南書です。対象読者は JavaScript道初段くらいの人です。このテキストを読むと、以下のそれぞれの手段における非同期処理制御の仕組み、利点および欠点がわかるようになるかもしれません。 コールバック地獄 jQuery.Deferred async.js Concurrent.Thread generators co fibers Web Workers (※なぜか『進撃の巨人』の一部ネタバレが含まれるので注意してください) それは『何故人はコールバックするのか』という話でしょうか？ 非同期処理って面倒ですよね。JavaScriptではいわゆる コールバック地獄 というやつにしばしば陥りがちです。たとえば、Ajax でふたつのファイル hoge.txt と piyo.txt を持ってきて、それら
waterfall.js
div要素などで配置した高さの異なるパネルをレンガ状に一定の隙間で配置するjQuery兼Zeptoのプラグインを紹介します。 左のサイドバーは適用なし、右だけレンガ状にできます。 waterfall waterfall -GitHub そういえば最近、デモにzeptoの方を使ってるプラグインが増えてきましたね。 waterfallのデモ waterfallの使い方 waterfallのデモ スクリプトのページ自体がデモになっています。 まずは、デスクトップサイズでの表示。 デモページ、幅780pxで表示 カラムの数はカラムの幅の最小値を設定することで、自動で表示されます。 ページ内の適用範囲も指定できるので、左のサイドバーはそのままの表示です。 waterfallの使い方 使い方は簡単です。 HTMLがあれば、数行加えるだけで完了です。 Step 1: 外部ファイル waterfallはj
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
FB/Google/Twitterへのシェアボタンを簡単に作れる「jquery.sharebox」:phpspot開発日誌
GitHub - ktty1220/jquery.popn-socialbutton: Twitter, Facebook, Google+1, はてなブックマーク, Pocketのカスタムシェアボタンを表示するjQueryプラグイン
bootpag - dynamic pagination jQuery plugin
GitHub - kflorence/jquery-deserialize: Decodes serialized form data and populates a form with that data.
GitHub - Bttstrp/bootstrap-switch: Turn checkboxes and radio buttons in toggle switches.
