タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JavaScriptとUIとHTML5に関するs_ryuukiのブックマーク (3)

  • クライアントサイドJavaScriptでのビューの作り方4つ - id:anatooのブログ

    追記: 指摘により、UIオブジェクト型を追加した(thx @kanreisa)。 クライアントサイドJavaScriptでのビューの作り方を大別すると、3つ4つある。 DOM操作型 テンプレートエンジン型 UIオブジェクト型 データバインディング型 ここでいうビューの作り方とは、有り体にいうとJavaScriptからどうやってDOM要素を生成したりするかどうか。イベントリスナーの登録とかも含む。 DOM操作型 昔ながらのやり方。jQueryとか使って直接DOM操作してビューを作る。 // 例えば、<div class='hoge'>fugafuga</div> みたいなDOMを表示する var myView = $("<div class='hoge'/>"); myView.text('fugafuga'); // body以下に挿入 $(body).append(myView); 長所

    クライアントサイドJavaScriptでのビューの作り方4つ - id:anatooのブログ
  • Backbone.jsでつくるMVPなUIパターン【タブ】 | DevelopersIO

    今回はBackbone.jsを使ってタブUIを作ってみたいと思います。デザインはTwitter Bootstrapをつかって以下のようにしました。 世界的に名高い企業の名前が並んでいますね。 デザインはhtmlを仮組みしてBootstrapで既にできていることにします。(題と離れてしまうので…すみません><) ボタンの部分に active というクラスをつけると選択中のデザインに変わり、 内容の部分におなじく active というクラスをつけると display: block; となり表示される仕組みです。 すべてactiveな状態 すべて非activeな状態 htmlはこちらです <div id='ui-tab'> <ul class='nav nav-tabs'> <li class="active"> <a href="#apple">Apple</a> </li> <li> <a

  • タッチデバイスを指で快適に操作させるために

    タッチデバイスのUIの特徴とその癖から、HTML5のWebアプリでUXを実現するポイント、Webでのタッチイベント仕様を見てみよう。 前編のタッチUXを実現する7つのポイントでは、タッチデバイスの特徴と、その上でタッチUXを実現する7つのポイントについて説明しました。後編では、そのようなUXを実現するためにWebアプリでのタッチ仕様や、実装のポイント、今後の動向など、より技術的な面から解説します。 W3Cによるタッチイベントの標準化 Webアプリケーション向けのタッチイベント仕様はW3Cによって標準化が進められていて、執筆時(2012/10/20 現在)の段階で、勧告候補となっています(最新のものはW3Cの明示する「Touch Events version 1」を確認してください)。まだ仕様は確定していませんが、最新のiOS、Androidのブラウザでほぼ仕様通りのものが使用できます。タッ

    タッチデバイスを指で快適に操作させるために
  • 1