---
title: Backbone.jsでTooltipの表示制御を実装
tags: []
categories: ["Programming", "JavaScript", "Framework", "Backbone"]
date: 2014-01-08T15:39:37Z
updated: 2014-01-08T15:39:37Z
---

Backbone.jsガイドブックのP.67あたりにのっているやつのカスタマイズ版を実装してみた。
<iframe width="100%" height="300" src="http://jsfiddle.net/4JGLm/embedded/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

スマフォに対応するために`touchstart`イベントも拾ってみた。PCと微妙に挙動が違うけど・・

CSSは[CSS Tooltip Generator][1]を使った。


<div class="amazlet-box" style="margin-bottom:0px;"><div class="amazlet-image" style="float:left;margin:0px 12px 1px 0px;"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4899773501/ikam-22/ref=nosim/" name="amazletlink" target="_blank"><img src="http://ecx.images-amazon.com/images/I/31tI0WaZukL._SL160_.jpg" alt="Backbone.jsガイドブック" style="border: none;" /></a></div><div class="amazlet-info" style="line-height:120%; margin-bottom: 10px"><div class="amazlet-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4899773501/ikam-22/ref=nosim/" name="amazletlink" target="_blank">Backbone.jsガイドブック</a><div class="amazlet-powered-date" style="font-size:80%;margin-top:5px;line-height:120%">posted with <a href="http://www.amazlet.com/" title="amazlet" target="_blank">amazlet</a> at 14.01.08</div></div><div class="amazlet-detail">高橋 侑久 <br />ラトルズ <br />売り上げランキング: 67,613<br /></div><div class="amazlet-sub-info" style="float: left;"><div class="amazlet-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4899773501/ikam-22/ref=nosim/" name="amazletlink" target="_blank">Amazon.co.jpで詳細を見る</a></div></div></div><div class="amazlet-footer" style="clear: left"></div></div>


  [1]: http://www.cssportal.com/css-tooltip-generator/