タグ

jqueryに関するaikeのブックマーク (55)

  • You Don't Need jQuery - Qiita

    注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで

    You Don't Need jQuery - Qiita
    aike
    aike 2016/04/13
  • jquery.easyAudioEffects.js

    EasyAudioEffects.js Easily set up sound effects to HTML elements Download on GitHub Latest Version : v1.0.0 with jQuery - v1.7.0 or Later. easyAudioEffects.js easyAudioEffects.js is jquery plug-in. This can be given a very easy sound effects for any of the elements on your WEB site. compatible browser This plug-in is the reaction slightly in Safari is slow. (Jun , 2015)

    jquery.easyAudioEffects.js
  • WebGLコンテンツをjQueryで作るJavaScriptライブラリ『jThree』

    WebGLコンテンツをjQueryで作るJavaScriptライブラリ『jThree』

    WebGLコンテンツをjQueryで作るJavaScriptライブラリ『jThree』
  • jQuery Mobile アイコンをボタンに表示する | Web Tips アーカイブ

    公開日:2014年10月10日 最終更新日:2014年11月8日 jQuery Mobile ではバージョン 1.4 時点で 50種類のアイコンが提供されています。それらのアイコンは簡単な指定でボタンに表示できるようになっています。この記事ではボタンにアイコンを表示する方法を解説します。 «次の特集記事» jQuery Mobile ヘッダーを設置する «前の特集記事» jQuery Mobile ボタンを設置する

    aike
    aike 2015/03/29
  • Rails / できるだけ高速に画像をアップロードする

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 widget = $('.image_widget') manipulation = $('.image_widget').find('.manipulation') #initialize widget.fileupload( singleFileUploads: true, autoUpload: false, ) addImage = (area, img) -> # --- いろいろ画像処理 --- # area.prepend(img) widget.on 'fileuploadadd', (e, data) ->

    Rails / できるだけ高速に画像をアップロードする
  • フルスクリーンのパノラマ画像サイトが作れる「leanorama」:phpspot開発日誌

    leandigo/leanorama GitHub フルスクリーンのパノラマ画像サイトが作れる「leanorama」 空間を自動で回転させるサイトを作る際に使えそう。実装サイトはインパクトがなかなかあります 関連エントリ ページを複数枚重ねたようなフルスクリーンページが作れる「pagePiling.js」 画像をフルスクリーンに拡大できるギャラリー作成jQueryプラグイン「fullsizable」 レスポンシブなフルスクリーンでスクロールするページが作れる「brock scroll」 フルスクリーンで縦横無尽に広がるページを構築できる「fullContent.js」 フルスクリーンのスライドを簡単に作れるjQueryプラグイン「FSVS」

  • ブラウザ・OSを検出してJSON化できるjQueryプラグイン「PgwBrowser」:phpspot開発日誌

    PgwBrowser - Browser & OS / platform detection plugin for jQuery / Zepto ブラウザ・OSを検出してJSON化できるjQueryプラグイン「PgwBrowser」。 次のようにJSON値でブラウザ、OS、viewport情報を受け取れます。iOS、Androidなどにも対応 関連エントリ ブラウザ上で動くイラストレーターのOSS「mondrian」 SVG非対応ブラウザでも魔法のようにSVGが表示できるjQueryプラグイン「SVGMagic」 複雑なレイアウトをブラウザ上でWYSIWYGで組み立てられる「Gridmanager」 ChromeのタブっぽいUIをブラウザ上で実現する「ChromeTabs」

  • 360度のパノラマイメージをストリートビュー風に動かせるようにするjQueryプラグイン「pano」:phpspot開発日誌

    seancoyne/pano GitHub 360度のパノラマイメージをストリートビュー風に動かせるようにするjQueryプラグイン「pano」。 一枚の360度撮影された画像があれば、マウスで動かせて見渡せるようにできるプラグイン。 デジカメやiPhoneでパノラマ画像が撮影できますが、横長になってしまいますので、そうした画像をWEB上で綺麗に見たい場合に使えるかも 関連エントリ サイト内にパノラマ画像をモダンな感じに読み込めるjQueryプラグイン「Panorama Viewer」 Google Tipsのようなヒントカードを並べて拡大できるUIを実装できる「jQuery Tip Cards」

  • jQuery Flight Indicators Plugin

    Flight Indicators jQuery Plugin The Flight Indicators Plugin allows you to display high quality flight indicators using html, css3, jQuery and SVG images. The methods make customization and real time implementation really easy. Further, since all the images are vector svg you can resize the indicators to your application without any quality loss ! This project is hosted on Github : https://github.

    aike
    aike 2014/05/14
  • jqPlot - Pure Javascript Plotting

    jqPlot is a plotting and charting plugin for the jQuery Javascript framework. jqPlot produces beautiful line, bar and pie charts with many features: Numerous chart style options. Date axes with customizable formatting. Up to 9 Y axes. Rotated axis text. Automatic trend line computation. Tooltips and data point highlighting. Sensible defaults for ease of use.

  • jQuery Panorama Viewer - jQuery製のパノラマ写真ビューワー

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました せっかく撮った写真、Webブラウザで楽しみましょう! iPhoneではパノラマ写真が撮影できるようになって、広範囲を映し出した写真が手軽に撮れるようになりました。しかしパノラマ写真は画像としてみれば単に横幅が広い写真でしかありません。むしろ写真としては見づらいでしょう。 そこで必要になるのは専用のビューワーです。今回はjQueryで作られた、WebベースのパノラマビューワーjQuery Panorama Viewerを紹介します。 jQuery Panorama Viewerの使い方 デモの写真です。マウスでドラッグして左右に移動できます。 実際に動作させているデモです。公式サイトで試用もできます。 iPhoneでパノラマ写真を撮るのは慣れるまで難しいですが、できあがった写真は迫力

    jQuery Panorama Viewer - jQuery製のパノラマ写真ビューワー
  • Mappy.js - Googleマップでマーカーを立てるのに便利なjQueryライブラリ MOONGIFT

    Googleマップは地図を便利に使える存在ですが、プログラムと組み合わせようと思うと若干面倒なことがあります。そうした時にはサードパーティ製のライブラリを使うのがお勧めです。 マーカーを立てたり、検索したりと言った操作をするならばMappy.jsが便利ではないかと思います。さっそく見ていきましょう。 マーカーを立てたところです。 コードはこんな感じになります。面白いのはリファレンスとして画像をBase64エンコードし、それをそのまま配置しているところです。また、クリックでマーカー詳細を表示するかどうかはautoShowで制御できます。 $("#custom-places").mappy({ showOnLoad: [ // City Varieties { // flag that this place should have the tooltip shown when the map

    Mappy.js - Googleマップでマーカーを立てるのに便利なjQueryライブラリ MOONGIFT
  • 使いやすくなった!UI素材とテクニック集/CSS jQuery版

    作成:2013/12/9 更新:2014/11/01 無料素材 > アプリを作るとき、クライアントさんのナビサイト、サービスを作るときにユーザーの満足度を上げれないか、使いやすく見やすく、コンバージョンを上げれないかと調べていたら、役に立ちそうなものが沢山ありました。今回はボタンやフォーム、ナビゲーションなどウェブサイトなどを使っていて楽しいと感じてもらうための素材やサンプルをcss/jQuery中心にまとめます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ メニュー 1.円形 2.タブ 3.ナビゲーション 4.アコーディオン ウィンドウ 5.モーダルウィンドウ 6.フローティングウィンドウ 7.Dialog(ダイアログ) 8.フォーム+バリデーション ボタン 9.Toggle (トグルボタン) 10.Switch (スイッチボタン) 11.Scrubbe

    使いやすくなった!UI素材とテクニック集/CSS jQuery版
    aike
    aike 2013/12/09
  • jQuery Mapael·jQuery x Raphaëlな地図描画ライブラリ MOONGIFT

    JavaScriptと連携できる地図が欲しかった方は要チェック! Web上でSVGを扱う際に使われるライブラリで有名なのがRaphaëlです。そんなRaphaëlをjQueryベースで使えるようにしたプラグインがjQuery Mapaelになります。地図に限定されますが、SVGで描かれた地図に様々な情報を付与したりJavaScriptと連携させることができるようになっています。 実際の例としてはフランスの地図を扱ったものが多くなっています。 マウスオーバーでハイライトされます。 さらにズームもできるタイプもあります。この辺りはSVGならではと言えるでしょう。 JavaScriptと連携させることでクリックイベントをキャッチできるようになっています。 人口の多い町や都市を描いています。こういった外部データとの連携も容易です。 最後はフランスではなく世界地図のデモです。 国ごとにデータを色分け

    jQuery Mapael·jQuery x Raphaëlな地図描画ライブラリ MOONGIFT
  • Custombox - Modal dialog with awesome effects by @dixso9

    Custombox is a modern dialog library which is highly configurable and easily styleable. Has a clear and simple API, works on mobile devices, and can be customized to match your style. Overview Check out the some following examples: Simple Fullscreen Loader Custom positions Custom animations Multiple dialogs Non overlay Video

    Custombox - Modal dialog with awesome effects by @dixso9
    aike
    aike 2013/10/09
  • ドロップダウンをフラットでクールにするjQueryプラグイン「EasyDropDown」:phpspot開発日誌

    EasyDropDown - A Drop-down Builder for Styleable Inputs and Menus ドロップダウンをフラットでクールにするjQueryプラグイン「EasyDropDown」 次のようなクールなドロップダウンを実装することが出来ます。CSSの切替えによって簡単にデザイン変更が可能 フラットデザインについては、今後しばらく盛り上がりそうです。 関連エントリ 美しいフラットなアイコンフォント「Dripicons」 フラットデザインが美しいレスポンシブなLightbox「Nivo Lightbox」 フラットだけど影で立体的に見えるフリーな汎用アイコンセット ハイクオリティなソーシャル向けのフラットアイコンセット フラットな62種類のファイル・タイプアイコンセット「File Type Icons」 200個のフラットなフードアイコンセット

    aike
    aike 2013/09/03
  • ScaleOut | Supership

    「ミライリアルの幸せを、デジタルの力で創る」ことを目指すSupershipグループの社内報です。日々の出来事、メンバーの働く様子や声、未来への想いなど、Supershipグループの”Be Super”なストーリーをみんなでシェアしていきます。

    ScaleOut | Supership
    aike
    aike 2013/06/20
  • 爆速でわかるjQuery.Deferred超入門

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結

    爆速でわかるjQuery.Deferred超入門
    aike
    aike 2013/03/06
  • 〜秒前の実装を簡単にするjQueryプラグイン「Livestamp.js」:phpspot開発日誌

    Livestamp.js - a simple, unobtrusive jQuery timeago plugin 〜秒前の実装を簡単にするjQueryプラグイン「Livestamp.js」 最近のリアルタイムなWEBでは、〜秒前、〜時間前といった表示がよくされていて、画面の遷移がなくてもこれが切り替わったりしますが、同じような実装を実現するためのプラグインです。 自分で実装しちゃってもよさそうですが、仕組みとして面白かったのでご紹介。 UNIXのタイムスタンプをタグに入れておいて、後は初期化という感じの使い方です。 待っていると表示が変わることを確認出来ると思います リロードがないと、実は5分前なのに1分前と表示するよりも、こうやってリアルタイムに更新してあげるのはやはり良いUIといえますね 関連エントリ 時間の入力を楽にすることが出来るjQueryプラグイン Youtube動画を自由

    aike
    aike 2012/08/10
  • フォーム内容が正規表現にマッチしなかったらヒント表示ができるjQueryプラグイン「InputNotes」:phpspot開発日誌

    フォーム内容が正規表現にマッチしなかったらヒント表示ができるjQueryプラグイン「InputNotes」 2012年07月12日- InputNotes jQuery Plugin フォーム内容が正規表現にマッチしなかったらヒント表示ができるjQueryプラグイン「InputNotes」 文字をタイプしていて、エラーがある場合はその場で表示してくれるプラグインです。正規表現によって入力ルールを定義出来るのが特徴 数字は禁止のtextarea。数字を入れると「Do not type numbers!」となります 数字だけを入力するルールの場合。 数字なら色を変えてOK、みたいな表示にできる フォームのバリデーションの1選択肢として使えそうですね 関連エントリ クレジットカード番号をバリデートできるjQueryプラグイン「Smart Validate」 お絵かきでCAPTCHAできるようにす