ここ最近は打ち合わせばかりで実作業がなかなかありません。面白そうな小話もシガラミがあって出せない感じ。ま、出せる時が来ればｗ
今年は数年振りに蛍を見に行くことが出来ました。落ち着きますね（ただし蚊に10箇所以上刺されながら…orz）。
さてさて週末ですが、同業者と京都で飲んでうっかり終電を逃し、話題のカプセルホテルに泊まる企画に参加してきました。えぇ、ついうっかりです。うっかり終電を逃してしまうので、事前にホテルの予約をしておきましたｗ
飲むお店は仕事仲間のカメラマンに紹介して貰ったフレンチバールの「ONZE」。初めて行った時もバカバカワイン飲んで終電を逃したのですが、その時はツレと二人でタクシーで帰りましたけどねｗ
なにしろ料理が旨い。メニューが魅力的。思ってるより量が多い。パンが大きい。落花生は掴み取りｗ
終電を逃しちゃいけない人がリアルに終電を逃しそうになったりしながらも、満足頂けた様で1つめのミッション終了。ちなみに今回もワインをボトルでバカバカ空けて行き、一人5,000円ほどでしたｗ
飲み足りない人たちはさらにバーへ繰り出して行ったのですが、連日飲みが続いている自分はお先にドロンさせて頂き、第2の目的であるオサレカプセルホテル「nine hours」へ。カプセルホテルながら洗練されたデザインで建築系の賞を受賞しまくってるなう、なところ。twitterを使ったプロモーションや客からの要望収集・対応など新しい試みも取り入れられてます。
カプセルの中も一般的な物と異なり、広さを感じさせるサイズ。圧迫感がありません。ありがちなテレビなどは無く、入眠・起床の事を考えられた照明システムが入っています。起床時間を設定しSleepを押すとだんだん暗くなり、設定時間の30分前からじわじわと明るくなっていきます。
じわじわ暗くなるのが気になって、いちいち目を開けて確認。朝も明かりが付く前から目が覚めてしまい、じわじわ明るくなるのを観察してました。えぇ、まったく意味なしｗ
京都観光だけでなく、ちょっとリフレッシュしてみたい時など、是非是非足を運んでみてください。
おまけ。
プランター菜園で一人気を吐くレモンバームの花が咲きました。
jQTouchネタが多いですね。案件で蓄積してるノウハウの小出しですｗ
あるボタンやリストをタップした時、画面が遷移する前にデータの取得やら処理を行いたい、という状況は多いかと思います。タップのイベントを拾って処理して、処理後に遷移すればOK。ということで
JAVASCRIPT:
-
$('#hoge').tap(function() {
-
// 処理
-
-
jQT.goTo('#next', 'slide');
-
});
上のネタはどこかのブログでも記事にされていたのを見たことがあるのですが、実はこれだけだと連打や他のボタンをタップしてしまうと画面遷移でブッ飛びます…orz
LocalDBに保存してる分でも後処理によってはタイムラグも発生するし、Ajaxで外部のDBサーバーに問い合わせするとボチボチ時間が掛かったりして余裕で連続タップされてしまうわけで。
こんな時は単純にフラグ立てちゃえばいいですね。
JAVASCRIPT:
-
$('#hoge').tap(function() {
-
if (!tapNow) {
-
tapNow = true;
-
-
// 処理
-
}
-
});
フラグを倒すタイミングはページの遷移が終了した時で良いので
JAVASCRIPT:
-
$('body > div').bind('pageAnimationEnd', function(event, info) {
-
touchNow = false;
-
});
で一括でフラグを倒すことが出来ます（エラー発生時などは個別に対応が必要ですが）
さらに、slideを繰り返すとgoBackでリストの.activeが解除されない（？）という謎なアレがあるので、ついでに
JAVASCRIPT:
-
$('body> div').bind('pageAnimationEnd', function(event, info) {
-
touchNow = false;
-
-
if (info.direction == "in") {
-
$(this).find('a.active').removeClass('active');
-
}
-
});
としておけば解除されますよ。
という小ネタでした。
ここ数日jQTouchでiPad用ローカルアプリを作ってるんですが、jQTouchオフィシャルではiPad用に2カラムを制御するための仕様策定が進んでいるようですね。
お手軽にiPhone・iPadの動きを伴ったjQTouchですが、画面遷移時に遷移後の画面が一瞬チラついたりして少し微妙な点があります。ソースを追って見たところ、アニメーションにはCSS3のアニメーション機能を使っているようです。
アニメーションを開始させるタイミングで、適したCSSをJSで指定してあげることで要素をアニメーションさせ、終わった段階でアニメーション用CSSを外してあげる。
ちらつきが発生する原因としては、アニメーション終了でCSSを外す時に同時にdisplay:noneになるのですが、ブラウザの仕様（？）で一瞬ちらつくみたいです。
ということで色々と対策を考えてdisplay:noneだけタイミングをずらしてみたりとか試してみたのですが上手く行かず。。。で、ググって見たら出てきました…orz
jqtouch.js
JAVASCRIPT:
-
function animatePages(from, ...
-
-
scrollTo(0, 0);
-
-
// 追加ここから
-
var toStart = 'translateX(' + (backwards ? '-' : '') + window.innerWidth + 'px)';
-
// 6/4追記ここから
-
if (animation.name == 'slideup' && backwards != true) {
-
toStart = 'translateY(0px)';
-
}
-
// 追記ここまで
-
fromPage.css( 'webkitTransform', toStart );
-
// 追加ここまで
-
-
var callback = function(event) {
-
// 追加1行
-
fromPage.css( 'webkitTransform', '');
-
-
if (animation)
（元ネタのページは失念です。。。）
元のソースに手を入れるのは気が引けるところですが、これでバッチリちらつきを無くすことが出来ます。お悩みの方は是非お試し下さいませ。
(6/4追記)
slideupのアニメーションで、遷移前のページが消えてしまう為、ソース改変の一部を変更しました。
ちなみにドキュメントには書かれてない（？）と思うんですが、縦スライドさせたいときは「slideup」ですが、任意で横スライドさせたい場合は「slide」です。
