タグ

2012年7月5日のブックマーク (5件)

  • brush.

    Supported Devices Access brush. from any iOS or Android device, alternatively login to the portal through any browser Select a package Purchase a package for discounts at salons which benefit your personal preference. From basic haircuts to full family packages including hair, nails, etc. How to use Browse the app for your nearest participating salon and call them to make a booking. Once treatment

  • スマートフォン用ページでリンク色の指定をする

    Web制作に携わる社員が仕事中わからなくて調べたことやTips。 あんま厳しい突っ込みはなしにしてください。m(_*_)m 最近、スマートフォン用サイトを作成していて、リンク色でいろいろ悩んだので備忘録的に。 一般的にHTMLでリンク色を指定するときはCSSで a:link a:visited a:hover a:active で指定します。それぞれの意味とか、某ブラウザでは順番間違えるとうまく効かないとかありますが、それはまた別なハナシ。 スマホの場合、リンクというよりもタップしたときの反応色を指定します。 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); *CSS3 RGBとalpha値を、それぞれ0~255、0~100で指定するわけです。 alphaが0ですので、上記の指定方法は色を見せない、タップしても色が変化しない記述です。 このあたり

    スマートフォン用ページでリンク色の指定をする
    araishi
    araishi 2012/07/05
  • Androidと-webkit-tap-highlight-color

    Androidと-webkit-tap-highlight-color Androidと-webkit-tap-highlight-colorの関係がよくわからず色々と悩んでいたのですが、ひと通りの結論が出たので紹介します。 そもそも-webkit-tap-highlight-colorってなによ iPhoneなどのスマートフォンでa要素をタップしたときにハイライトさせるプロパティです。ハイライトと言ってもiPhoneの場合は半透明のグレーのレイヤーが表示されるのですが。 サンプル このレイヤーの色を-webkit-tap-highlight-colorで制御することが可能です。 a { -webkit-tap-highlight-color: rgba(0,0,215,0.40); } このようにするとハイライトカラーが半透明な青色に変わります。 サンプル ただし、このように指定してもA

    Androidと-webkit-tap-highlight-color
    araishi
    araishi 2012/07/05
  • iPhoneでa:hoverを実装する|シラサヤ備忘館

    タイトルにはa:hoverを実装すると書いたが、iPhoneにはマウスオーバとかいう概念がない。 まあマウスが無いんだから当たり前だけど。 なのでhover、つまりマウスオーバ時のリンク色変更というのとは厳密には違うことになるねぇ。 iPhoneでは指が乗っているか外れたかというイベントが取れるので、 今回はタッチスタートとタッチエンドというイベントでリンク色を変更するというものになる。 実装方法は以下の通り。 まず前提条件としてjQueryを利用している。 自分の場合はスマホ用に最適化するのにjQueryMobileを使っているので、リンク色一つの変更でも、jQueryMobileのそれと競合しないように意識してやらなければならない。 やれやれ。 ■タッチスタートとタッチエンドでリンク色を変更する <script type="text/javascript"> <!-- $(functi

    araishi
    araishi 2012/07/05
  • iPhoneサイト向けCSSサンプル(CSS3)|ConneLog|ConneCre

    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1"> * { word-break: break-all; -webkit-touch-callout:none; -webkit-tap-highlight-color:rgba(255,255,0,0.4); -webkit-text-size-adjust:none; } word-break: break-all; URLなどの文字列の強制改行。ただし句読点なども先頭にくるため要検討。 -webkit-touch-callout:none; 長押しした際のとび先URL非表示。ただし画像リンクをタップした際のハイライトがおかしくなる。aタグ要素にdisplay: block ;を指定す