スマホサイトバルーンでお気に入り追加を促すjquery

2015年3月23日更新 view: 30 view

jqueryでお気に入り追加を促す?

お気に入り追加を促す場合は
bookmark_bubble.js
を使うと良い

参考
http://code.agnist.jp/iphone/294

ファイルを
https://code.google.com/p/mobile-bookmark-bubble/source/browse/
でダウンロード

html読み込み

<script type="text/javascript" src="js/bookmark_bubble/bookmark_bubble.js"></script>
<script type="text/javascript" src="js/bookmark_bubble/example.js"></script>

562行目を以下のように変更

if (this.getIosVersion_() >= this.getVersion_(4, 2)) {
/*bubbleInner.innerHTML = 'Install this web app on your phone: ' +
'tap on the arrow and then <b>\'Add to Home Screen\'</b>';*/
bubbleInner.innerHTML = 'ホーム画面へインストールしましょう!
矢印をタップして<b>「ホーム画面に追加」</b>で完了です。';
} else {
/*    bubbleInner.innerHTML = 'Install this web app on your phone: ' +
'tap <b style="font-size:15px">+</b> and then ' +
'<b>\'Add to Home Screen\'</b>';*/
bubbleInner.innerHTML = 'ホーム画面へインストールしましょう!
<b style="font-size:15px">+</b>をタップして<b>「ホーム画面に追加」</b>で完了です。';
}
スポンサードリンク

ホームアイコンを用意

<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">

594行目あたりを以下のように変更

var close = document.createElement('a');
close.onclick = google.bind(this.closeClickHandler_, this);
close.style.position = 'absolute';
close.style.display = 'block';
close.style.top = '0px';
close.style.right = '0px';
close.style.width = '32px';
close.style.height = '32px';
close.style.border = '10px solid transparent';
close.style.background =
'url(' + this.IMAGE_CLOSE_DATA_URL_ + ') no-repeat';
bubbleInner.appendChild(close);

これでCSSも整い、バルーンも出てくるようになります。

スポンサードリンク

関連記事

関連カテゴリ

ぺにこ

まとめーたー最高!今月も稼ぐぞー!目指せ月収100万円!

ピックアップ

パソコン・ソフトウェア ランキング

7月19日 ( 金 ) にアクセスが多かった記事はこちら!