Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
![[JavaScript]クリップボードを使ったコピーとペースト - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/315bbb83ee3ab58101e511f6679c3bf9ad0c3846/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCSmF2YVNjcmlwdCU1RCVFMyU4MiVBRiVFMyU4MyVBQSVFMyU4MyU4MyVFMyU4MyU5NyVFMyU4MyU5QyVFMyU4MyVCQyVFMyU4MyU4OSVFMyU4MiU5MiVFNCVCRCVCRiVFMyU4MSVBMyVFMyU4MSU5RiVFMyU4MiVCMyVFMyU4MyU5NCVFMyU4MyVCQyVFMyU4MSVBOCVFMyU4MyU5QSVFMyU4MyVCQyVFMyU4MiVCOSVFMyU4MyU4OCZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9ZTNlN2U2NzNkYTM1YTU5Y2Y2NGM0ZWZkNjFmMTc2MDQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBidXRha29tYSZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9Y2U5ODllOTA5MzU5NzEyNGJkYmEzZTRkZWU2NjI2NDk%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D82ef0c5a60cc7cf340e85a448a6fe0fb)
アプリケーションを実行しているスマホの画面サイズや向きを動的に取得できれば、それに応じて表示するコンテンツを調整できますよね。 画面サイズを取得する JavaScriptで画面サイズを取得するためのプロパティが用意されています。 ウィンドウサイズを取得できる関数 screen.width document.write(screen.width); 画面の幅を取得することが出来ます。 screen.height document.write(screen.height); 画面の高さを取得することが出来ます。 画面サイズとタスクバーを除いたスクリーンサイズを取得することが出来ます。 コンテンツ領域を取得できる関数 window.innerWidth document.write(window.innerWidth); ウィンドウ内側の横幅を、取得したい場合に使用。 ※ スクロールバー領域を含
Internet Explorer 11には過去のIEとの後方互換性のために、それぞれのレンダリングのルールを切り替えるための仕組みとして「ドキュメントモード」という機能を搭載しています。 このドキュメントモードは、ツールメニューの互換表示設定、もしくはF12開発者ツールのエミュレーションから指定することができますが、一般的なユーザーが自ら切り替えることはあまりないでしょう。ほとんどの場合は、Webの提供者が指定されることになると思いますが、その場合はHTMLのドキュメント内、もしくは、WebサーバーのHTTPレスポンスヘッダにX-UA-Compatibleで指定します。 [caption id="attachment_192" align="aligncenter" width="879"] 日本マイクロソフトのWebサイトでのX-UA-Compatibleの指定[/caption] ド
TwitterのストリーミングはFireFoxで動くサンプルが Ajax+Streaming API — 開発な日々 にあるのだが、これがFireFoxでしか動かなかったので、IEでどうにか動かないものかと模索してみたが、IEではAjax経由でストリーミングのデータを取得しようとするとストリームの受信状態を示す readyState=3の時に受信済みのデータ、responseTextを扱うことが出来ず、IEでは「この操作を完了するのに必要なデータは、まだ利用できません。」というJavaScriptエラーが発生する。 以前は、responseStreamで扱えたようなのだが、IEのセキュリティパッチで封印されて今は使えない模様。したがって接続の都度APIに接続・切断を繰り返してタイムラインを取得するようにすると使えるのだが、いくらAPI制限が無いStreamingでも接続と切断を繰り返してい
目次 概要 XMLHttpRequest() ActiveXObject(ProgID : String [, location : String]) キャッシュ制御 クロスドメイン制限 XMLHttpRequest Level 2 サンプルコード 参考URL 概要 JavaScriptの非同期通信に利用される XMLHttpRequest() の解説まとめ。Ajax と呼ばれることもあります。 XMLHttpRequest() // --- XMLHttpRequest if (!'XMLHttpRequest' in this) { this.XMLHttpRequest = (function () { var i, l; for (i = 0, l = arguments.length; i < l; i++) { try { return arguments[i]; } catc
XMLHttpRequest を使用出来るようにする為の宣言。ブラウザにより異なる。 IE では、ActiveXObject("Microsoft.XMLHTTP") を使用。 IE のバージョンによっては、ActiveXObject("Msxml2.XMLHTTP.5.0") , ActiveXObject("Msxml2.XMLHTTP.4.0") , ActiveXObject("Msxml2.XMLHTTP.3.0") , ActiveXObject("Msxml2.XMLHTTP") なども使用出来る。 Mozilla 系ブラウザでは、XMLHttpRequest() を使用。 var xmlhttp = false; if(typeof ActiveXObject != "undefined"){ try { xmlhttp = new ActiveXObject("Micro
ExcelからXMLHTTPを呼び出したときに特定のURLでエラーが発生することがあると先日書いた。 Excelから使っていることが原因なのかどうかを切り分けるため、IE(HTML)から呼び出したときにどうなのか、確認してみた。 結果としては、Excelの時と同じく、ブラウザでもエラーとなってしまった。 エラーとなるページは何が悪いのか?調べようと思い、該当ページを自製ツールでダウンロードしようとしたところ、うまくダウンロードできない。 おかしいと思いレスポンスヘッダを確認したところ、どうやら該当ページは 302 Found を返している模様。 いろいろ見比べたところ、ヤフオクでは(見つけられる限りでは)3パターンのレスポンスを返しているようだと言うことが分かった。 (1)アダルトカテゴリ以外の場合 200 OK を返し、期待するオークションページを返す (2)アダルトカテゴリの場合 20
こんにちは。LIGフィリピン支社代表のせいとです。 コーディング中にバグやブラウザ仕様のせいで、「なんじゃこりゃアア」ってなること、皆さんありませんでしょうか。 今回は、その中でもとりわけ「なんじゃこりゃアア具合」が激しいトラブルを、僕の独断と偏見のランキング形式でお話しさせていただきます。 なんでランキング形式にしたかというと、そっちの方が面白いと思ったからです。面白くなかったらごめんなさい。 第5位 IE9.jsを入れると、IE7で謎の隙間が発生しまくる IE9.jsを採用したサイトをIE7,8で見ると、 <class="ie7_anon ie7_class6" id="ie7_pseudo2" style="overflow: hidden; display: block;"/> こんなものが追記されていたりします。 こいつに高さがあるせいで、隙間が生まれてしまいます。が、こいつがな
ウェブサイトの多数のページ全体に渡り、スタイルシートで定義されたセレクタが使用されているかどうかチェックし、使われていないセレクタのレポートを生成するスクリプトを紹介します。 納品する際に、不要なセレクタを除去するのに役立ちますよ。 Helium -GitHub Heliumの準備 Heliumの使用方法 Heliumの準備 HeliumはjQueryなど他のスクリプトを必要せず動作し、URLのリストから全てのページをロードし、解析して、スタイルシートで見つけたセレクタが全ページで使用されているかどうかチェックし、レポートを作成します。 スクリプトは、開発環境で実行してください。 公開中のサイトで実行すると、ユーザーにもHeliumの動作が見えてしまいます。 Step 1: 外部ファイル テストするページの全てに、当スクリプトを外部ファイルとして記述します。 場所は、head内でも</bo
IE8以降の互換表示設定IE8以降 には互換表示設定(ツールバーの[ツール]→[互換表示設定])というのがあり、[イントラネットサイトを互換表示」のチェックボックスがオンになってると IE8以降のバージョンであっても IE7 としてレンダリングされてしまう。 これを防ぐためには X-UA-Compatible で レンダリングしたい IE のバージョンを指定する。X-UA-Compatible の記述は head 要素内の先頭か charset を指定する meta 要素の次当たりにするのが無難(script や style 要素の後だと適用されない)。 <meta http-equiv="X-UA-Compatible" content="IE=8;IE=9"/> 上記のように複数バージョンを指定した場合は、指定バージョンの中から適用可能な最上位バージョンが適用される。上記例の場合 IE
IE6はタヒぬDeath! こんばんは、クラスメソッドWebマスターの野中です。 今日はクリスマスですね、社内には独り身の負のオーラが満ちてます(既婚者が多いので残っている人は少ない)。 ところで、最近はCSS3もすこしずつ使えるようになってきていて、IE6からIE8の対応を蔑ろにしてしまっている自分がいます。 Web制作に携わってから6年、常に付きまとう古いIEは腐れ縁というか、ある意味青春ですね。 とっても今さら感たっぷりなお題目ですが、ここでIE対応のポイントを自分のために総浚いして青春に決着をつけたいと思います。 過去の経験と情報収集をもとにまとめているので実際にテストしたものではありません。 解決のきっかけ程度になれば良いと思いまとめています。 IEの現状 一般的なブラウザと先進的なブラウザに対する手法と考え方 ドキュメントタイプ:文書型定義 IE向け条件付きコメントで分岐処理
[動画で検証]たった2行でIE5.5~IE8をモダンブラウザの挙動にする魔法のJSが重すぎた!
現在、A!@attripさん発で話題になっている「たった2行でIE5.5~IE8をモダンブラウザの挙動にする魔法のJS」という記事。 Webデザイン界隈では当たり前のものですが、実はもうひとつ追加しておくといいかもしれないjsがあったりします。 Photo:html5 By michael pollak IE8以前のブラウザはどうにもこうにも開発者泣かせなわけですが、ie9.jsとcss3-mediaqueries.jsを突っ込むことで、モダンブラウザと同じ挙動にすることができちゃいます。 もう少し具体的に書くと、ie9.jsを組み込むことで、 position:fixed;に対応 max-width、max-heightに対応 属性セレクタ、擬似クラスに対応 margin:0 auto;でのセンタリングに対応 透過PNGに対応 opacityに対応 といったことが可能になります。要はCS
開発者泣かせの問題児ブラウザ、Internet Explorerですが、IE5.5、IE6、IE7、IE8をモダンブラウザの挙動にする神JSがGoogle Codeで配布されていました。 とりま、 attripのデザイン崩れはこれで解決できました! 使い方は簡単!下記のコードを貼り付ければOK! まじ仏。 「IE9.js」は、IEを普通のモダンブラウザの挙動にするJSです。IE5、IE6でも透過PNGが使えるようになります。 「css3-mediaqueries.js」は、IEでCSS3 Media Queriesを使えるようにするJS。レスポンシブデザインのサイトをIEでも見れるようにします。 ちなみに、border-radiusや、box-shadow はできませんでした。 あと、IEでの見え方をチェックする方法はこちら↓↓ IE9環境でIE6/IE7/IE8/IE9表示する方法(共存
2011/10/13 : IE8だと動かないミスがあったので一部修正(addRule の引数部分) IE とそれ以外のブラウザで一々処理を分けるのも面倒くさいし、CSSがある場合ない場合の処理を分けるのも面倒なので以下の様にすると楽ちん……かも。 head がない場合はもう知らん。 // スタイルシート挿入用共通メソッド addCSS var style = document.createElement('style'); style.setAttribute('type', 'text/css'); document.getElementsByTagName('head')[0].appendChild(style); var sheet = document.styleSheets[0]; if (sheet.insertRule) { sheet.addCSS = function
こんにちは、中川です。 今回はJavaScriptで開発していると、うっかりハマってしまうちょっとした罠たちを紹介したいと思います。 JavaScriptでの開発経験者であれば、どれか一度はひっかかったことがあるのではないでしょうか? String ●String#replace()は文字列指定では全部置き換えない 対象文字列を一括して置き換えたいなどでString#replace()を使いますが、 検索対象を文字列で指定してしまうと最初に一致した部分しか置換しません。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く