jQuery UI RailsでTwitterBootstrap

jQuery UI BootstrapにGoogle Mapが来た〜gmap3

投稿日:

addyosmani.github.com/jquery-ui-bootstrap/map.html#block-tabs

gmap3.net/

Rails3.2+jQueryUI1.10でjQuery-UI-Bootstrapのデモ画面を出すところまでやった 

アコーディオンと組み合わせた例

アコーディオンと連動してマーカーの色が変わる

screenshot

 

タブと組み合わせた例

タブの中に地図が描かれて、指定のアイコンや大きさで描画できる

screenshot

gmap3

gmap3はjQueryからGoogleMapを使えるようにしたプラグイン

もともとかなり高機能

gmap3.net/en/pages/19-demo/

これは右クリックメニューを使って経路検索をしたやつ

本家より便利なんじゃ?

screenshot

-jQuery UI, RailsでTwitterBootstrap
-

執筆者:

関連記事

Rails3.2でページネーションをTwitter Bootstrapに対応させる~kaminari

github.com/amatsuda/kaminari 目次1 Gemfile & bundle2 設置3 テーマの作成 Gemfile & bundle [crayon-58b5a …

SASS/SCSSでButtonをカスタマイズするならSassy Buttonsが簡単

By: Meike Schönhütte – CC BY 2.0[/caption]   jaredhardy.com/sassy-buttons/ 目次1 Railsでのインス …

no image

jQuery UIの将棋でつくったまとめ~jQuery UI draggable droppable

  目次1 盤上の駒の動き2 盤上の駒の座標を取得する3 手番(ターン)の変更4 盤外からの駒の動き5 将棋のルールの分析6 ゲームの計算処理など 盤上の駒の動き draggableの設定 …

Rails3.2とBackbone.jsでGoogle CalendarライクなカレンダーにCRUD~fullcalendar-rails

目次1 前回2 READ ~データベースからイベントを読み込んでカレンダーに表示する3 CREATE~カレンダーからイベントを登録する4 UPDATE1~カレンダーのイベントをクリックしてイベントを編 …

no image

Rails3.2でTwitter Bootstrap2対応のkaminariテーマを自作する〜というよりcucumber

環境 Rails3.2でページネーションをTwitter Bootstrapに対応させる~kaminariの続き すでにテーマがあるので適当に作っていたら、ページネーションをクリックしても昇順・降順の …