画面上の文字や画像を選択できないようにする at softelメモ
問題 文字や画像をダブルクリックされると、選択状態になってしまう。 文字やリンクや画像に、onclickで何らかの処理をするスクリプトを作っているのだが、カチカチクリックされたときやドラッグされたとき選択状態になると、どうにもかっこ悪い。 ダブルクリックしたときやマウスを使って選択しようとしたときに、選択状態にならないようにできる？ 答え CSS3では以下のように書ける。 user-select: none; ただ、だいぶ普及した角丸をするborder-radiusのようには広く実装されていないようなので、現状では各ブラウザの独自実装にも合わせておく必要がありそう。 以下のように、各実装にあわせた記述をしておく。 user-select: none; /* CSS3 */ -moz-user-select: none; /* Firefox */ -webkit-user-select:
1emが何pxなのか自動的に計算する方法(Final) : やむにやまれず
2007年07月24日16:16 by 山崎泰宏 1emが何pxなのか自動的に計算する方法(Final) カテゴリJavaScript Tweet sparklegate Comment(0)Trackback(1) クロスブラウザでなおかつ以前より簡単な方法修正：ソースコードに余計な行が入っていたのを削除しました。 以前はgetComputedStyle()に取り憑かれていたのだけど、一つ前のエントリを書いている最中に「あ、もしかして」と違うことを思ったので早速実験してみたらうまくいきました。 1emのdivセクションを設けてあげれば、clientWidthかclientHeight辺りが良い感じにpxの値を返すようです。 それだけ！ <html> <head> <title>em2px</title> <script language="javascript" type="text/j
ブラウザの更新 スーパーリロード
初心者でも簡単作成 Webサイト（ホームページ） パソコン インターネットの勉強、情報 NetyaSun スーパーリロードとは ブラウザのキャッシュを無視し、強制的にWebサーバーからファイルをダウンロードする方法。 「フルリロード」「強制再読み込み」ともいう。 WEBページや画像などのファイルを編集後、転送・表示で確認すると、 何も変わらず、古いファイルが表示される場合がある・・・ これは速度の向上のため、ブラウザのキャッシュが、前回保存したファイルを表示してしまうからだ。 通常なら、ブラウザの更新ボタン、または、F5キーで更新されるが、 ブラウザキャッシュが強烈に効き過ぎて、再読み込みでも更新されない場合がある。 キャッシュを毎回削除するのも面倒なので、スーパーリロードで読み込んでしまいましょう。 インターネットエクスプローラー IE Windows Internet Explorer
ブラウザの戻るボタンで戻ったときに呼ばれるイベントとかキャッシュとかそこらへんのこと - koumiyaの日記
IEでは戻るボタンで戻ったときにonloadイベントが呼び出されるが、Firefoxでは呼び出されないなどブラウザによって動きが違うようです。 よくある二度押し防止対策として、送信ボタンをクリックしたときにボタンを無効(disable = false)にして次の画面に遷移させるということをやりますが、その後ブラウザの戻るボタンで戻られるとボタンが無効のままで操作できないままになってしまいます。 その対策として、画面を表示したときに無効を解除するという処理が考えられますが、IEではonloadイベントが呼ばれるがFFでは呼ばれないという上記の問題が発生します。 調べてみたところ、戻るボタンとonloadイベント - a geekで紹介されている方法で解決できるみたいです。IEではonloadを使い、FFではpageshowを使い、Safariではonloadとonunloadの合わせ技で戻る
[CSS]floatの指定が有る要素の親要素に高さを持たせる方法 | Coffee Breakにプログラミング備忘録
divにfloatを効かせた場合の親要素に与える影響について対処法をメモ 親要素divとその小要素divがある関係性の時に、小要素divにfloatを付けると親要素divの高さが0になる（下図） ※下図の場合は行間、margin、paddingの影響で多少の高さがでている状態。 この場合、mainに対して背景色などの設定をした場合にdivの高さがないため、範囲全体に適用されない。 この事象に対する2つの改善方法を記載する 対処法1.clear: both;を新たに作成するコンテントに設定 スタンダードな改善方法。 mainにコンテントを作成しclearfixとしてclear: both;を適用させることでflortをクリア（回り込み解除）する clear: both;を適用する事でクリアされmainが全体を括るサイズとなる。 まずclear: both;を適用させる要素がないためmainの
![[CSS]floatの指定が有る要素の親要素に高さを持たせる方法 | Coffee Breakにプログラミング備忘録](https://cdn-ak-scissors.b.st-hatena.com/image/square/e66e7643d72d4b529afb01e1a87534b7fc2583af/height=288;version=1;width=512/http%3A%2F%2Fto-developer.com%2Fblog%2Fwp-content%2Fuploads%2F2013%2F08%2Fclearfix_l.png)
スタイルシート［CSS］/ページ全般/水平線の表示位置を指定する - TAG index
text-align は水平方向の揃え方を、margin-*** は上下左右のマージンを指定するプロパティです。これらのプロパティをhr要素に対して設定すると、水平線の表示位置（左寄せ、右寄せ）を指定することができます。 指定方法はブラウザにより異なります。Firefoxなどでは、左または右のマージンを0にすることで表示位置を指定できますが、IEなどでは text-align プロパティで指定する必要があります。どちらにも適用させたい場合は、この2つを同時に指定しておきます。 表示位置を指定する場合は、同時に水平線のサイズを指定しておく必要があります。（長さの初期値が100%なので） hr { width: 50%; text-align: right; margin-right: 0; }
)
Conditional comments are no longer supported (Windows)
Support for conditional comments has been removed in Internet Explorer 10 standards and quirks modes for improved interoperability and compliance with HTML5. This means that Conditional Comments are now treated as regular comments, just like in other browsers. This change can impact pages written exclusively for Windows Internet Explorer or pages that use browser sniffing to alter their behavior i
IEだけに適用されるHTML「条件付きコメント」の使い方
こんにちは、さち です。 ウェブサイト制作の経験がある人には有名な話なんですが 古いバージョンの Internet Explorer（以下：IE） は ウェブサイトの表示で 特殊な挙動，未実装の問題 があり サイトを作る時に、別途 IE 対策が必要です。 そこで今回は IE だけに適用される HTML を記述できる 「条件付きコメント」の使い方についてまとめていきます。 「条件付きコメント」とは？ 「条件付きコメント」は IE だけが解釈できる HTML コードです。 構造は下記のようになっています。 <!--[if IE 7]> 適用するHTMLコード <![endif]--> 最初に、<!--[if IE 7]> で適用する IE のバージョンを指定。 例では、[if IE 7] なので 閲覧者のブラウザが IE7 の場合に適用します。 次に、適用内容を HTML 形式で記述。 最後に
【HTML】条件付きコメントでIEとそれ以外のブラウザでの処理を分岐する方法 ｜ KLUTCHE
あなたのブラウザはIEではないですね！ 今このサイトを閲覧しているブラウザがIEか否かによって上の文章と写真が変わるはずです。 わかりやすいように IEの場合は重力式コンクリートダム IE以外はアーチ式コンクリートダム の画像を表示します。 HTMLはこんな感じになっています。 <!--[if !IE]><!--> <img src="arch.jpg" alt="アーチ式ダム" width="400" height="200" /> あなたのブラウザはIEではないですね！<br /> <!--<![endif]--> <!--[if IE]> <img src="gravity.jpg" alt="重力式ダム" width="400" height="200" /> あなたのブラウザはIEですね！<br /> <![endif]--> コメント内の[if !IE]で、IEかどうかの判別を
jQuery.ajax でリクエストをキャッシュさせない方法 - 葉っぱ日記
jQuery.ajax を使ってGETでリソースにアクセスした場合、IEでは2回目以降のリクエストが実際には発行されずにキャッシュされた結果が使われてしまいます。これを防ぐには $.ajax( { url : "http://example.com/", cache : false, data : { a : "abcd" }, ... } ); のように、cache オプションに false を指定すればいいようにドキュメント(http://docs.jquery.com/Ajax/jQuery.ajax#toptions)に書かれています。実際に cache : false を設定してみると、リクエストの発行される URL は、 http://example.com/?a=abcd&_=1253861397368 のようにクエリの末尾に現在時刻のミリ秒が付加されたものになります。 たい
Web制作者は注意！ Internet Explorer 11で変更された「互換性」
Windows 8.1正式版がMSDNサブスクライバー向けに公開され、それに標準搭載される「IE11」も正式版となった。しかしこのIE11にはWeb制作者に大きな影響がある「互換性」に関する変更が含まれている。 2013年9月10日、MSDN Subscriptionの登録者は、Windows 8.1正式版がダウンロードできるようになった。Windows 8.1の標準ブラウザーであるInternet Explorer 11（以下、IE11）では、互換性に関する大きな変更が加えられている。 ご存じのとおり、IEは、現在も更新されているブラウザーの中では最古参のブラウザーである。ほかのブラウザーが新しく登場して、HTML5などモダンな機能を実装していく中、互換性の課題に引きずられているという問題があった。また、HTML5などのサポートが遅れたため、ほかのブラウザーと同様にモダンな機能を提供して
歌うキツネ : User-Agent (ユーザー エージェント) 一覧
User-Agent (ユーザー エージェント) 一覧 2016年12月現在 各種ブラウザのユーザーエージェントの表示 | 各種ブラウザのバージョンの表示 Edge | IE11 | IE10 | IE9 | IE8 | IE7 | IE6 | IE備考 Firefox | Google Chrome | Opera | Safari | Vivaldi Android | iOS - iPhone/iPad/iPod touch | Windows Mobile Microsoft Edge Microsoft EdgeのUA変更(偽装) Windows 10 32bit Version 1607 Build 14393 Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.27
JSONをvbscriptとして読み込ませるJSONハイジャック(CVE-2013-1297)に注意
はせがわようすけ氏のブログエントリ「機密情報を含むJSONには X-Content-Type-Options: nosniff をつけるべき」にて、巧妙な罠を仕掛けることにより、別ドメインのJSONデータをvbscriptとして読み込み、エラーハンドラ経由で機密情報を盗み出すという手法が紹介されました。これは、IEの脆弱性CVE-2013-1297を悪用したもので、MS13-037にて解消されていますが、MS13-037はIE6～IE8が対象であり、IE9以降では解消されていません。 また、MS13-037を適用いていないIE6～IE8の利用者もしばらく残ると考えられることから、この問題を詳しく説明致します。サイト側の対策の参考にして下さい。 問題の概要 JSON形式のデータは、通常はXMLHttpRequestオブジェクトにより読み出しますが、攻撃者が罠サイトを作成して、vbscript
pixiv の javascript のコメントが面白い - Dlog 隔離館
イラスト コミュニケーションサービス[pixiv(ピクシブ)] お絵描きサイト、pixiv！ 何気なく、pixiv の javascript のソースを眺めてみると、いろんなコメントがありました。 ニョーン ... 7686: // マウスオーバーでおすすめタグをニョーンと出す 7687: var timer = null; ... マジ天使 ... 452: selectCover: function(c) { 453: // [IE マジ天使] 送れないので遷移させる 454: if ($.browser.msie) { ... pixiv.group.js http://source.pixiv.net/source/js/pixiv.group.js なげえｗ ... 248: if (handler) { 249: // TODO 引数再考。なげえ 250: handler =
君は3つのリロードを知っているか？ - os0x.blog
はい、今さら聞けないウェブ開発者の基礎知識のお時間です。 ブラウザには3つの読み込みモードがあることはご存知ですか？ 2つくらいはわかるけど、3つ目が出てこないって方は少なくないかもしれません。 リロード 一番オーソドックスなのがブラウザのリロードボタンを押したときの挙動ですね。普通ですね。 スーパーリロード ブラウザによっては、スーパーリロードという機能を備えています。IEの場合Ctrl+F5(Ctrl+更新ボタン)、Firefoxの場合Ctrl+F5(Shift+更新ボタン)、Chromeの場合Shift+更新ボタン(Ctrl+Shift+R)などでスーパーリロードを呼び出すことができます。スーパーですね。 ページ遷移(リフレッシュ) 3つ目はちょっと良い名前が思いつかないのですが、リロードではなく、通常の画面遷移での読み込みのことです。アドレスバーにフォーカスしてenterするといっ
小人さんへの置き手紙: title 属性のツールチップ内で改行
カテゴリ html title 属性のツールチップ内で改行 2004-01-03 14:38 更新 多くのウェブブラウザは、HTML の title 属性の内容をツールチップとして表示する。内容が長い場合は適当に改行して表示することもある。では、任意の位置に改行を入れることはできないのだろうか？ WinIE では title="1行目 2行目" 実は、これで Windows IE はツールチップ内で改行してくれる。つまり、改行コードを空白扱いせず、改行として扱ってくれるのだ。しかし、妙な位置で改行すると、可読性が落ちるし、気持ち悪い。もうちょっとマシな方法はないものだろうか。 Windows での改行コードは CR+LF で、10 進表記コード番号は CR が 13 、LF が 10 だ。そこで、先程の例を次のように書き換えてみる。なお、 は数値文字参照で、先程の改行コードの番号に対
画像をCSSだけでハイクオリティに縮小サムネイル化する方法:phpspot開発日誌
Tip: High quality CSS thumbnails in IE7 ・Devthought 画像をCSSだけでハイクオリティに縮小サムネイル化する方法が紹介されています。 普通、IEで、img に対して、width, height 指定すると、画像が汚く縮小されちゃってましたが、CSSの指定をしちゃうとそれが解決されるということのようです。 具体的には以下のCSS指定によってそれが可能みたいです。 img { -ms-interpolation-mode: bicubic; } デモページ う〜ん、縮小してもとっても綺麗です。 FirefoxやChromeの場合は何も指定しなくても綺麗に縮小される、っていうのも知りませんでした。 これは、サーバサイドでサムネイルを生成しなくて良くなる場面が出てきて開発者としては手間の削減になりますね。 転送量を考えれば、サムネイルが完全に不要に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Internet Explorer デベロッパー センター
IE6～IE9を同時に表示確認できるMicrosoft純正ソフト [ホームページ作成] All About![IE6～IE9を同時に表示確認できるMicrosoft純正ソフト [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
IE9用のCSSハック？Webページのフォントサイズ指定で今後注意する事
