html { touch-action: none; } に潜む罠 - console.lealog();
解決してしまったTap delay問題 #html5j 例えばこの記事を見て、 html { touch-action: none; } ってそのまんま書いてみちゃってませんか？ 実はこれ罠があるのでちゃんと意味を知っておかないと困ります。 そう、私のように・・。 何が起こるか Tap delayを消したいがためにコレを書くと、単純に「画面のスクロールすらできなくなる」場合があります。 再現端末例: Xperia Z1 / Android Chrome 40 まーたAndroidがやらかしたのかと最初は思ったんですけど、まぁ割とハイスペックな端末で、かつChromeなんですよね。 まあiPhone5 / iOS Chrome 40だと起こらないのでまーたAndroidか案件には変わりないんですけど・・。 touch-actionとは Pointer Events | 9.1 The tou
ページの文字コードとは違う任意の文字コードをformから送信する方法｜web bibo
楽天検索やYahoo!オークションなどの検索窓を設置したとき、設置したページの文字コードと違う文字コードで検索キーワードを送らないといけない場合（例：UTF-8の設置ページで、EUC-JPの検索キーワードを送る場合）、少し面倒な処理が必要なんですね。今回はYahoo!オークションで試してみます。あ、今回はCSSに一切触れませんので、あしからず。 普通にformを設置したら、キーワードが文字化けする。 設置ページの文字コードと検索先の文字コードが異なるので、上手く検索できません。 <form name="yahooSubmit" method="get" action="http://search.auctions.yahoo.co.jp/jp/search/auc"> <input type="hidden" name="auccat" value="0" /> <input type="
スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
jQueryでスクロールすると表示する系いろいろ
Posted: 2012.03.08 / Category: javascript / Tag: jQuery, アニメーション 最近はスクロールするときにいろいろ仕掛けをするのが流行なようです。 ここではシンプルにある要素の位置とか最下部までスクロールしたら何か表示するということをやってみます。 ちょっとスクロールするとフェードして「トップへ戻るボタン」を表示を表示します。 ボタンは下の方にこんな感じで配置します。 html <p id="page-top"><a href="#wrap">PAGE TOP</a></p> fixedにすると固定配置されます。 css #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; } #page-top a { background: #666; text-
どや！？ひよっこデザイナーにもできるWebページ高速化！鍵は「HTTPリクエストの数を減らすこと」 | デザインどや！？
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー＆カルーセルプラグイン、チャート＆グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
[JS]画像をクロスフェードで変更するスライドショーの超軽量スクリプト -Simplest Slideshow
余計な機能は一切なく、シンプルで画像を洗練されたエフェクトで次々に表示するスライドショーのスクリプトをSnook.caから紹介します。 Simplest jQuery Slideshow demo このスクリプトを作成したきっかけは、知人からの依頼だそうです。 当サイトでも多数紹介しているjQueryのプラグインで同様の動作をするものがありますが、多機能すぎるためクロスフェードするだけのシンプルで軽量のものを作成することにしたそうです。 そこで、コードの目標を20行以下で挑んだところ、作成してみると、下記のように大幅に短いものになってしまったとのことです。 ※動作には別途jquery.jsが必要です。 JavaScript <textarea name="code" class="html" cols="60" rows="5"> $(function(){ $('.fadein img:
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
