人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

tumblrのシェアボタンって、IE7でみると
javascript版はテキストリンク
php版は非表示になってしまうみたいなんですが
みなさんもそうですか?
http://www.tumblr.com/buttons

●質問者: よしたか
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● rouge_2008
ベストアンサー

IE9の開発者ツールで確認しましたが、Javascript、PHPともに同じ動作でした。
「display」プロパティに「inline-block」が指定されている状態で、「text-indent」を指定した場合の挙動の違いが原因のようです。(※IE8以降はテキストのみ移動しますが、IE7では背景画像も移動してしまいます。)
最も簡単な方法としては、Tumblrのシェアボタンの前(※同じ行)にテキストや画像など何か出力するだけで大丈夫です。(※Tumblrのボタンは一番左に表示せず、FacebookやTwitterなどのボタンの右側に表示してみてはいかがでしょう?)

その他の方法としては、「inline-block」ではなく「block」を指定して、各種ボタンを並べて表示する場合は、「float」を指定してもいいと思います。

その他には、次のように背景画像ではなく、画像として表示してもいいと思います。

<a href="http://www.tumblr.com/share/link?url=<?php echo urlencode(INSERT_URL_HERE) ?>&name=<?php echo urlencode(INSERT_NAME_HERE) ?>&description=<?php echo urlencode(INSERT_DESCRIPTION_HERE) ?>" title="Share on Tumblr"><img src="http://platform.tumblr.com/v1/share_1T.png" alt="Share on Tumblr" width="81" height="20"></a>

※画像URLと幅、高さは、使用するボタン画像に合わせて変更してください。

※Javascriptの場合も原因は同じですので、同様の方法で対処可能です。
※出力されるコードが同じですので、おそらくRuby on Railsでも同様の現象が発生すると思いますが、同じ方法で対処可能だと思います。

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ