コーディング - ページ 11

テーマは私たちの開発者にとって個人的なものです、それは単にエディタやツールの美化についてではありません。私たちが注視しているスクリーンを（明滅させることなく）何時間にもわたって生産的な方法で作業するのに耐えられるものにすることです。 Firefoxには、開発者向けツールという2つのテーマがあります。それは、暗いと明るいです。どちらも素晴らしいですが、それらをパーソナライズする方法がないとオプションはまだ限られています. 現在、FirefoxはそのUIにXULとCSSの組み合わせを使用しています。つまり、その外観の大部分はCSSだけを使用して調整できるということです。 Mozillaはユーザーが "userChrome.css"と呼ばれるCSSファイルでその製品の外観を設定する方法を提供します。あなたはできる そのCSSファイルにカスタムスタイルルールを追加する そしてそれはMozilla製品に反映されるでしょう. この記事では、同じCSSファイルを使ってFirefoxの開発者ツールをカスタマイズします。. まず、そのCSSファイルを見つけるか、作成して正しい場所に配置する必要があります。 "userChrome.css"を格納するフォルダを見つける1つの簡単な方法は about：support ブラウザで 「Profile Folder」というラベルの横にある「Show Folder」ボタンをクリックします。. これでFirefoxの現在のプロファイルフォルダが開きます. プロファイルフォルダには、 "chrome"という名前のフォルダがあります。存在しない場合は、作成してその中に "userChrome.css"を作成します。ファイルの設定が完了したので、コードに移りましょう。. ：root.theme-dark --theme-body-background：＃050607！重要です。 --theme-sidebar-background：＃101416！重要です。 --theme-tab-toolbar-background：＃161A1E！重要です。 --theme-toolbar-background：＃282E35！重要です。 --theme-selection-background：＃478DAD！重要です。 - theme-body-color：＃D6D6D6！重要です。 --theme-body-color-alt：＃D6D6D6！重要です。 --theme-content-color1：＃D6D6D6！重要です。 --theme-content-color2：＃D6D6D6！重要です。...

特定のジャンルが好きな本を愛する人のために、彼らはおそらくどんなベストセラーリストに従うよりも友人の推薦をチェックするでしょう。 AmazonのGoodreadsが熱心な読者のためのブックマークされたサイトであるのはこのためです。それはあなたが本、同僚の本を愛する人たちによる推薦とレビューの広範なデータベースを見つけることができる場所です. Goodreadsは開発者に以下のためのAPIも提供します。 そのデータにアクセスし、さらにパーソナライズする 私達の適用によってそれ。今日は、ISBNまたはInternational Standard Book Numberを使用して、Goodreads APIを介してGoodreadsの書籍評価を取得する方法について説明します。これは、後で書籍情報などをWebサイトに表示するときに使用できます。. 開始するには、ログインするか、Goodreadsに名前、EメールID、およびパスワードでサインアップしてに進みます。 https://www.goodreads.com/api/keys （リンク）。アプリケーション名と会社名を入力してAPIキーを生成します。次に、入力したメールアドレスに記載されているメールでアカウントを確認します。. 必ずAPIの開発者向け利用規約をチェックしてください。彼らはまた彼らのAPIページにAPIメソッドのリストを持っています、それらのメソッドのいくつかはOAuth認証を必要とするでしょう、残りはただ 開発者キーが必要, この記事で見るもののように. これらのメソッドのレスポンスタイプはさまざまです。XMLかJSONのどちらか、あるいはこれらの2つの間で選択するオプションのどちらかです。 フォーマット パラメータ. book.review_counts 書籍ISBNのリストに関するすべてのレビュー統計を取得するGoodreads APIメソッドです。その応答タイプはJSONです。リクエストURLは次のとおりです。https://www.goodreads.com/book/review_counts.json . それは4つのパラメータを取ります。 キー, これは開発者キーです isbns - レビューの対象となる書籍のISBNの配列またはカンマ区切りの文字列 フォーマット -...

JavaScript APIが唯一の使命であることを知っていますか ノードをフィルタリングして繰り返します DOMツリーから欲しい？実際、1つではなく2つのそのようなAPIがあります。 NodeIterator そして TreeWalker. それらは互いに非常に似ていますが、いくつかの有用な違いがあります。両方ともできます ノードのリストを返す に準拠しながら、与えられたルートノードの下に存在する 事前定義済みおよび/またはカスタムのフィルタルール それらに適用される. APIで利用可能な定義済みフィルタは私たちを助けることができます さまざまな種類のノードをターゲットにする テキストノードや要素ノード、カスタムフィルタ（当社が追加）などがあります。 束をさらに絞り込む, 例えば、特定の内容を持つノードを探すことによって。返されるノードのリストは 反復可能, すなわち彼らはすることができます ループスルー, リスト内の個々のノードすべてを処理できます。. 使い方 NodeIterator API A NodeIterator オブジェクトを使用して作成することができます createNodeIterator（） の方法 資料...

前の記事のサンプルコードを作成することで、Node.jsを使用することの実際の利点は何かを実感することができます。本日の記事では、イベントベースのプログラミングにおけるNode.jsの使用を明確に示す実用的なスクリプトを投入しました。. 特定のFacebookページの「Facebookが好き」の数を出力する簡単なスクリプトを作成します。そしてそれに加えて、2秒ごとに「Facebookが好き」の数を更新する追加機能を投入します。. 出力は単純でわかりやすいものになるでしょう。おそらく "Like of Likes：2630405"のようになり、CSSを使用してスタイルを設定するのはあなた次第です。それでは始めましょう。! あなたにアイデアを与えるために Node.jsを使い始める前に、一般的なサーバーサイドのプログラミング言語（PHPなど）を使用して通常行うことを考えてみましょう。あなたがAJAXに電話をかけての数を調べることを考えているならば 好き 2秒ごとに - あなたは正しいです - しかしこれは可能性があります サーバーのオーバーヘッドを増やす可能性がある. 検討できる アクセスする graph.facebook.com これは 時間のかかるI / O操作. 5人のユーザーが同じページにアクセスしたとします。 好き）アクセス数 graph.facebook.com 2秒以内に10になります。 好き 2秒に1回 別のスレッドとして実行されます. Node.jsサーバー実装では必要ありません。のみ...

エミー賞受賞 W3C World Wide Webの国際標準化団体です。それは新しいウェブ標準を作成し、それらが世界中で一貫性があり関連性を保つように絶えずそれらを修正します. ブラウザとWebサイトは、時間の経過とともに標準規格に準拠するようになりました。これにより、Webサイトはすべてのさまざまなブラウザで統一的にレンダリングおよび動作できます。公に利用可能な最も有用なリソースの1つはw3c.orgのW3C仕様書です。. 最近W3CはそのデータをWeb APIを介して利用できるようにしました。そのプロジェクトページはGithubにあります。プロジェクトページからのこのAPIの紹介は次のとおりです。 “W3Cのデータとやり取りしたいという私たちのコミュニティの開発者からの要求に応えて、W3CシステムチームはWeb APIを開発しました。それを通して、仕様、グループ、組織、ユーザーに関するデータを入手可能にしています。.” 今日の記事では私たちが見るでしょう W3C APIを介して仕様データを取得する方法. 仕様データなどを取得するために投稿できるさまざまなリクエストはhttps://api.w3.org/docにあります。また、APIをテストするためのリクエストごとにサンドボックスも用意されています。 APIキー. まず見てみましょう APIキーを取得する方法. W3Cアカウントにログインするか、アカウントを作成してください。. それから APIキーを管理する あなたのプロフィールページに. クリック 新しいAPIキー 鍵を生成するための名前を付けます. それからあなたが望むならば、あなたはそれをコピー＆ペーストすることができます APIキー サンドボックス内のAPIをテストするためのWebページhttps://api.w3.org/docの先頭にあるテキストボックス. この記事のために、我々は調べます 使用する要求 ショートネーム...

音声トランスクリプトはテキスト形式のスピーチで、録音された講義、セミナーなどの有用な資料を聴覚的に問題のある方に提供するのに役立ちます。インタビュー、法廷審問、会議などのイベントのテキスト記録を保管するためにも使用されます。. （Podcastのように）Webページの音声は、聴覚障害のある人やまったく聞こえない人のために、通常はトランスクリプトを伴います。彼らはすることができます 音声の横に「再生」というテキストを表示する. 音声トランスクリプトを作成する最善の方法は、手動による解釈と録音によるものです。. この記事では、見ていくつもりです 実行中の音声記録を音声と一緒に表示する方法. 始めるためには、トランスクリプトを用意する必要があります。この記事のために、私はサンプルオーディオとそのトランスクリプトをからダウンロードしました。 voxtab. 私はHTMLを使います ul 以下のようなWebページにダイアログを表示するためのリスト。 ジャスティン：私が言おうとしているのは、上訴と和解は別のものであるということです. アリステア：あなたは、内外のコミュニケーションと発表が上訴プロセスに持ち込まれることを意味します. ジャスティン彼らは訴えにつながるから.… 次に、利用可能なすべてのテキストをぼかして、 音声録音によって再生されている現在のスピーチに一致するダイアログだけをぼかします。. だから、ダイアログをぼかすために私はCSSフィルタ "blur"を使う. #transcript> li -webkit-filter：blur（3px）filter：blur（3px）;移行：すべての.8は簡単です;… IE 10以降の場合は追加できます テキスト影 ぼかし効果を作成します。このコードを使用して、CSSブラーが適用されているかどうかを検出し、IE固有のスタイルシートを読み込むことができます。テキストがぼやけたら、先に進み、トランスクリプトにスタイルを追加しました. if（getComputedStyle（dialogues [0]）。webkitFilter ===未定義&& getComputedStyle（dialogues [0]）。filter...

画像の背景 大きな表示テキストの背後にはよく見えます。しかし、そのCSS実装はそれほど単純ではありません。我々は使用することができます 背景クリップ：テキスト。 プロパティ、しかしそれはまだ十分なブラウザのサポートなしで実験的な機能です. テキストの背後に画像の背景を表示するCSSの代替方法は、 を使用して ミックスブレンドモード 財産. HTML要素のブレンドモード Internet Explorerなど、いくつかの例外を除いて、最近のすべてのデスクトップおよびモバイルブラウザでかなりサポートされています。. この記事では、どのようにしてそれを見るつもりです ミックスブレンドモード （特にそのモードのうちの2つ）は機能し、どのようにそれを使用することができますか 画像の背景を含むテキストを表示する 2つのユースケース 背景画像が 見られます 本文を通して 背景画像が 走り回る テキスト 下記のデモのいくつかの例を参照してください（画像はunsplash.comからのものです）。. CodePenのHONGKIAT（@hkdc）によるImage Background付きのペンテキストを参照してください。. の ミックスブレンドモード CSSプロパティは、 コンテンツ そしてその...

jQueryのUIは単に素晴らしいですし、使いやすさのために、それは人気がありインタラクティブな機能を必要とするほとんどすべてのウェブサイトで広く使われています. そして、この記事では、提供されている機能の1つ、Datepickerウィジェットについて見ていきます。. あなたがあなたの全体的なデザインに対応するあなた自身のテーマを作成することができるように、私たちはカレンダーテーマをカスタマイズする方法を学ぶことを試みます。ただし、このチュートリアルを始める前に、JavaScriptについて少し理解し、CSSに精通しておく必要があります。. デモ ソースをダウンロード 準備ができたら、始めましょう. 資産 カレンダーの重要な資産をいくつか準備しましょう. まず、カレンダーのデザインはPremium PixelsのこのPSDファイルを参照します。だから私たちが必要な色のサンプルを取るのを助けるために最初にそれをダウンロードしたほうがいいです。次に、から2つのパターンをダウンロードしてください。 微妙な パターン カレンダーの背景として使用します。この例では、次のパターンを使用することにしました。黒デニムとダークレザー. jQuery UIによって生成された要素クラス/ IDを調べるには、FirebugのようなWeb開発ツールも必要です。. まあ、私たちは十分な準備ができたと思います。それでは最初のステップに行きましょう. ステップ1：jQuery UI Datepicker まず、jQuery UIダウンロードページに行きます。このページでは、次のようにいくつかのオプションが表示されます。 UIコア、ウィジェット、インタラクションとエフェクト. 我々はすべき すべてのコンポーネントの選択を解除します, 全部必要なわけではないので. それから、 ウィジェット 日付ピッカーのみを選択します。 jQuery...