タグ

ブックマーク / www.mayoinu.com (4)

  • はてなブログで吹き出しを使おう!(その2)モバイル版の吹き出しCSS作成。 - いつもマイナーチェンジ!

    昨日の続きです。 昨日は、CSSを使った吹き出しを理解することころまででした。 今日はそれを応用して、モバイル版の吹き出しの形を少しだけ変えていきます。 ちなみに、この方法は「はてなブログPro」を利用している方のみ可能だとういう事を先に書いておきます。 では、早速。 ★ちなみに前回の記事はこちらです はてなブログで吹き出しを使おう! CSSでの実装方法を勉強したので解説します。 - いつもマイナーチェンジ! 目指すイメージ まず、PC版はこんな感じ。 モバイル版はこう。 画像が真ん中に配置されたのに加えて、吹き出しの三角も上辺の真ん中に移動しています。 こんな感じで、PCから見るか、モバイル端末から見るかによって、自動で見え方を変えたいわけです。 スマホの画面って横幅が狭いので、PC版のレイアウトだと文章が読みにくいですからね。 では、やっていきます。 モバイル版のCSS 使っているCS

    はてなブログで吹き出しを使おう!(その2)モバイル版の吹き出しCSS作成。 - いつもマイナーチェンジ!
    koda3
    koda3 2015/05/06
    参考になります
  • はてなブログで吹き出しを使おう! CSSでの実装方法を勉強したので解説します。 - いつもマイナーチェンジ!

    僕はいつも、記事の最後に「あとがき」をつけているのですが、画像から吹き出し付きで書くようにしています。 ですが、これ、モバイル版ではちゃんと表示されていないのを分かっていながら放置してたんです。 CSSを利用した吹き出しなので、仕組みがなかなか難しく、後回しになってしまっていました。 この仕組を理解しないことには、放置しているモバイル版の対応もできないまま。 それはまずいので、ようやく重い腰をあげて勉強してみました。 あとがきの表示 PC版ではこんな感じの表示になってます。 それに対して、モバイル版はこんな感じでした。 吹き出しになってませんね。 最初はこちらの記事を参考に吹き出しを設置したのですが、 PC版だとスペースが広いので、画像の右側に吹き出しをおけるのですが、モバイル版は横幅が狭くなるので下側に吹き出しを置いたほうが見やすくなります。 ですが、そうすると、吹き出し特有の三角部分(

    はてなブログで吹き出しを使おう! CSSでの実装方法を勉強したので解説します。 - いつもマイナーチェンジ!
    koda3
    koda3 2015/05/05
  • MacのChromeで急に右クリックが効かなくなった時に確認すること - いつもマイナーチェンジ!

    僕はMacでブラウジングする時にはGoogle Chromeを使っています。 そのChromeなのですが、昨日から急に右クリックが効かなくなりました。 僕はリンクを開く時、右クリックして「新しいタブで開く」というクセがあるので、これができないと非常に困る。 最初、マウスが壊れたかと思ったのですが、Chrome以外ではちゃんと動作するのです。 効かないのはChromeだけ。 どういうこと? アップデートか何かで設定が変わった? いろいろ調べていたら、とりあえず原因が分かったので書き留めておきます。 操作していると、たまに反応することがあった 基的には右クリックしても反応しないのですが、ごく稀に反応することがあったんです。 なぜだ、なぜだ、と思っていたら、どうやら「右ダブルクリック」すると反応する模様。 どういうことでしょう? 今までは普通にシングルクリックでできていたのに、どうしてダブルク

    MacのChromeで急に右クリックが効かなくなった時に確認すること - いつもマイナーチェンジ!
  • アプリ紹介ツール『アプリーチ』が便利! iPhoneとAndroidの両方を同時に紹介できる! - いつもマイナーチェンジ!

    このブログは僕が良いと思ったものを書くようにしているので、その中でアプリ紹介などもするのですが、最近ちょっと困ってました。 以前は iPhoneしか使っていなかったので、iPhoneアプリだけを紹介していたのですが、去年の暮れに Xperiaを購入したことで、Androidアプリも使うようになったわけです。 となると、やっぱり両方のアプリを紹介したい。 でも、紹介コードを生成してくれるサービスは、どちらか片方だけのものが多いのです。 はてなブログの標準機能でも、iTunes商品しか紹介できない。 さて、どうしたものかと思って探していたら、作ってくれている人がいるものですね。 今日紹介するのは、『アプリーチ』というWEBツールです。 今までのやり方 例えば、Google Chromeの紹介は、こんな感じでやってました。 ▶Google Chrome うわぁ、ダサい・・・・。 一応、目的は達成

    アプリ紹介ツール『アプリーチ』が便利! iPhoneとAndroidの両方を同時に紹介できる! - いつもマイナーチェンジ!
  • 1