これ知っておかないと！Chromeのアドブロックで非表示にされてしまう広告の配置方法 | コリス
Chromeに広告を非表示するアドブロックが標準機能として搭載される噂を耳にしていましたが、それが具体的にどのような広告が対象になるかは不明でした。 GoogleのSearch Consoleに新コンテンツが追加され、デスクトップとスマホでどのような広告が非表示にされてしまうか詳しく解説されています。 「Better Ads Standards」にはユーザーが特に不快に感じる広告の種類を掲載されており、それらに当てはまる場合は修正してね、というものです。 2018年から適用予定で、デスクトップやスマホでけっこう見かける広告が掲載されているので、注意が必要です。 非表示にされてしまうデスクトップの広告 ポップアップ広告 ページのメインとなるコンテンツの一部・全体を隠すようにポップアップして表示される広告。このタイプの広告は、ユーザーをイライラさせるだけです。 サウンド付き、自動再生されるビデ
標準ではないけどNode.jsの便利なデバッグ方法 - Qiita
Node.js をデバッグする方法はいくつかありますが 今回は標準ではないですが、便利な方法があるので紹介します 使うもの Node.js v6.6 以上 v6.3 からでも可能ですが、いろいろバグがあるらしいので Chrome v55 以上 前準備 標準の方法ではないため、Chrome のフラグを設定する必要があります デベロッパー ツールの試験運用版機能の有効化 Chrome で chrome://flags/#enable-devtools-experiments を開き、有効にします 「有効にする」をクリックすると、ブラウザの再起動を要求されるので、再起動します Node debugging の有効化 ディベロッパーツールの設定を開くと、↓このように「Experiments」が追加されています ここで、Shift キーを6回叩くと・・・ 裏設定？が表示されるので、「Node deb
Google ChromeにてDOMノード追加に異様に時間がかかる現象が発生して悩む→拡張機能が原因だった - 風柳メモ
JavaScriptでページ遷移用のナビゲーションを作っていたのだが、リンクと半角スペース(テキストノード)とを交互に挿入するような実装にしていると、なぜか異様に時間がかかってしまう（数百個程度のノード挿入に、数秒要する）。 どうやら、ナビゲーションのノードがDOMツリー上にあるとこうなるようで、いったんDOMツリーから切り離した状態で作成し、最後にDOMツリーに戻すようにすると、ほとんど時間はかからない。でもなぜ……？ さんざん悩んだが、結局はとある拡張機能が原因だった、というオチ（今回の場合ははちまバスター）。 もっと早くに、シークレットウィンドウで調べておくべきだった……。 【追記】なお、はちまバスターは早々に改修された。 テスト function test_add_nodes( options ) { if ( ! options ) { options = {} } var pa
「Firefox」及び「Google chrome」の拡張機能！「Video DownloadHelper」に関する使用手順について - ネットセキュリティブログ
2015-10-08 「Firefox」及び「Google chrome」の拡張機能！「Video DownloadHelper」に関する使用手順について 動画及び画像 全般情報（ダウンロードに関する情報知識及び操作方法等） 皆様、こんばんは。いよいよ季節は10月を迎えて、早朝及び夜間は肌寒く感じる頃となりました。それでは今回の投稿にまいりましょう。 皆様、こんばんは。いよいよ季節は10月を迎えて、早朝及び夜間は肌寒く感じる頃となりました。それでは今回の投稿にまいりましょう。 はじめに さて今回の投稿は、前回に引き続いて「Video DownloadHelper」に関する投稿となります。前回の投稿では「Video DownloadHelper」に関する日本語化ファイルを公開させていただきましたが、今回の投稿では「Video DownloadHelper」に関する使用手順について記載して
お疲れさまXMLHttpRequest、こんにちはfetch - Qiita
Service Workersでプッシュ通知を受信できるようになったわけですが([1]: GCM)([2]: Web Push)、Chromeではバージョン48まではGCMで通知だけができるようになっただけで、メッセージ本体は通知を受けてからService Workerでサーバから改めて受け取るような実装をする必要があったりします。 ここで、Service Workersでは、XMLHttpRequestが使えません。その代わり、XMLHttpRequest (以下、XHR)に代わるWHATWGの仕様としてFetch APIがあり、Service WorkersではこのFetch APIを使うことになっていますので、その使い方を簡単に紹介します。 Fetch API自体は、Service Workers専用のものではなく、メインスレッドでもXHRの代わりに使うことが可能です。現時点で実装し
Chrome開発者ツールの小技集 | POSTD
最近、普段以上にChromeの開発者ツールを使うことに時間をかける機会がありました。その過程で、自分が今まで気づいていなかった機能をいくつか見つけました（少なくとも今までその機能を探す必要に迫られていなかった、とも言えるのですが。例えばブラックボックス化や非同期のスタックトレースなど）。そのため、開発者ツールでとても気に入っているいくつかの機能についてまとめてみたくなったのです。 小さな虫眼鏡ののアイコンは、特定の要素やCSSプロパティに対して、「どのCSSファイルに書かれているどのセレクタ/クラスが最終的なスタイルを決めているか」を示してくれます。例えば、どれかDOM要素に対して「要素を検証」を選び、右側の「Computed」というタブを選びます。確認したいCSSプロパティを見つけてその虫眼鏡アイコンをクリックすることで、すぐさま右側に正しいCSSファイル内のクラス/セレクタを表示してく
Chrome デベロッパーツールの使い方: プロのように華麗に使いこなすための20のテクニック
Chromeのデベロッパーツールをプロのように使いこなすための20のテクニックを紹介します。 いやー、本当にデベロッパーツールは機能が豊富ですね。 How to use Chrome DevTools like a Pro 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 HTMLの要素をクイック編集 指定した行番号に移動 すべての子ノードを展開 デベロッパーツールの位置を変える CSSのセレクタによるDOM検索 Material Designとカスタムカラーパレット 複数のカーソル 画像をData URIとしてコピー 疑似クラスのトリガー 複数のコラムをドラッグで選択 「$0」で現在の要素を手に入れる 要素の表示 「Event Listeners」の表示 イージングのプレビュー Media Queriesの検証 ネットワークをフィルム
今から３分で，Chromeブラウザの独自アドオンを自作してみよう （jQueryを使ったクローム拡張機能を，開発および動作テストする入門） - 主に言語とシステム開発に関して
今から３分で，Chromeブラウザのアドオン（拡張機能）を作ろう。 ここで作るのは，「表示したWebページの内容をjQueryで加工する」というChromeプラグインだ。 アドオン自作の入門，初歩の第一歩にうってつけ。 作成に必要なツールは，なんとメモ帳だけ。 JavaScriptやJSONなどの「Web系技術」を使って，ちょこっとコーディングするだけで完成してしまう。 わずか３分で作成とインストールを終えるので，今すぐに始めてみよう。 （１）フォルダを作ってjQueryを格納 （２）マニフェストを作成 （３）メイン処理を実装 （４）ブラウザにインストールする （５）動作テスト 使い終わったら 参考資料 （１）フォルダを作ってjQueryを格納 まず，どこでもいいので，適当な名前のフォルダを作成する。 フォルダ名は「hoge」でよい。 下記URLから，jQueryをダウンロード。 先のフォ
Google Chromeの「デベロッパーツール（要素の検証）」画面を独立したウィンドウに切り替える方法
Google Chromeには信じられないほど便利な「デベロッパーツール」がある。通常のPC表示だけではなく、最新のスマートフォンのディスプレイサイズに偽装し表示を確認できるなど、ウェブ制作者必見のデバッグツールなのだ。 比較的頻繁にgori.meのデザインをいじっている僕も活用しているが、昨日久しぶりにGoogle Chromeを再インストールした際にデバッグツールがGoogle Chromeと一体化してしまい、これまで利用していたように独立したウィンドウとして使用することができなかった。 あれこれ触っているうちにGoogle Chromeのデベロッパーツール（要素の検証）画面を独立したウィンドウに切り替える方法を発見したので、紹介する！ 画面表示位置切り替えボタンを長押しで独立ウィンドウに切り替え まずは「Command + Option + I」または右クリックで「要素の検証」をクリ
【Tips】超高速にChromeのブックマーク/履歴を検索する方法 | ソフトアンテナ
Chromeの検索エンジンの管理機能を使えば、Google以外に、Yahoo!やBingを使って検索したり、自分で登録したブログを検索することができます。さらに便利なことにChromeのブックマークや、履歴を検索することもできるのです(AddictiveTips、Lifehacker)。 今回は、Chromeのアドレスバーを使って、ブックマークと履歴を検索する方法を紹介します。 検索エンジンの管理 Chromeの右上にあるメニューボタンをクリックし「設定 > 検索 > 検索エンジンの管理」と進みます。 「他の検索エンジン」の下の方に以下の二つを追加します。 Chromeの履歴 / ch / chrome://history/?#q=%s Chromeのブックマーク / cb / chrome://bookmarks/?#q=%s 名前 / キーワード / URLの順です。名前とキーワードは
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
