• iframeのクロスドメインでよく使われるいくつかの方法

    背景 事業が大きくなれば、当然、各プロジェクトのパブリックな業務が抽出され、パブリックなコンポーネントとなる。しかし、プロジェクトごとに異なる技術スタックを使用しているため、このパブリックコンポーネントを簡単に参照することができません。そこで、このコンポーネントをドメイン名の下に別ページとして記述し、他のプロジェクトではこのページをiframeやwebviewで読み込むことで、シンプルな機能の再

    2022-01-14 04:19:34
  • textareaで改行や空白を処理する

    textareaを使ってフォアグラウンドでテキストを編集し、jsでバックエンドに送信する場合、スペースと改行が最も考慮しなければならない問題です。textareaでは、スペースと改行は次のように保存されます。 /s と /n 私たちが入力して前面に表示するテキストがテキストエリアであれば、何もしなくても、テキストエリアに書いたスタイルが、前に編集したスタイルに従って、正しく表示されるのです。

    2022-01-14 03:44:39
  • アップロード用画像の圧縮にcanvasを使用した例

    プラグインのuiとプロトタイプが異なるので、自分でメソッドを書きました。 まず、アップロードボタンが必要です。 <input type="file" id="fileys" class="fileys" @change="uploadFile($event)" accept=" image/*"/> <! --uploadFile uses change becau

    2022-01-14 02:46:11
  • HTMLのテキスト属性とカラーコントロール属性の実装

    I. 文字装飾のための属性 1. 書式:text-decoration:underline; 2. 価値観です。 (1) アンダーラインは下線を意味する (2) line-through は strikethrough の略です。 (3) overline は、オーバーラインの略です。 (4) none は何も書式設定しない(デフォルトはこのプ

    2022-01-14 02:45:28
  • Html5ページオープンアプリに関するいくつかの考察

    1.要件 少し前のことですが、あるプロジェクトを開発していたところ、ある要件に出くわしました。簡単に言うと、私たちのH5ページには「アプリで開く」ボタンがあり、ユーザーがそれをクリックすると、ユーザーがアプリをインストールしている場合は直接アプリが開かれ、ユーザーがアプリをインストールしていない場合は、アプリのダウンロードページにジャンプするのです まず、私の知識では、H5はアプリがインストー

    2022-01-14 02:43:25
  • Htmlにおけるvalue属性とname属性の役割とその利用法

    1. ボタンに使用する値は、"OK"、"Delete"など、ボタンに表示されるテキストを指します。 2. チェックボックスの値は、チェックボックスの値を参照します 3. ラジオボックスの値は、チェックボックスと同じです 4. ドロップダウンメニューに使用される値は、リスト内の各子項目の値である 5. hiddenフィールドの値は、ボックス内に表示される内容です バックエンドでチェ

    2022-01-14 02:28:34
  • html5 モバイルアダプティブレイアウトの実装

    シナリオ 様々な画面サイズに対応するため 私が知っているアダプティブレイアウトの2つの方法 1. メディアクエリを使用して、いくつかの適応方法を以下に展開します。例えば、最初のものは、画面幅が320px-360pxの間であることを示し、htmlフォントサイズを13.65pxに適応させます。 <style> @media only screen and (max

    2022-01-14 02:23:19
  • タグの擬似クラスの役割と書き順について

    aタグの擬似クラスの役割について。 ":link":まだ訪問していないaタグの状態です。 ":visited"。訪問されたタグのステータス。 ":hover"。aタグの上にマウスを置いたときの状態です。 ":active"。aタグがマウスで押されたときの状態。 スタイルを書くとき、なぜこの順番で書かなければならないのですか。 以下、4つの擬似クラスと合わせて簡単に説明します。

    2022-01-14 02:21:39
  • 花火用キャンバスサンプルコード

    前置き:もうすぐ大晦日、旧正月の祝福+花火の卵をこっそり背景の中に埋める予定です。プロジェクトはreact+typescriptに基づいているので、最終的にコンポーネントにカプセル化され、オープニングの時間を表示することができます設定します。 ディレクトリ構成 ディレクトリ構成はおおよそ以下の通りです。 花火が爆発するまでの連続上昇期と、爆発した後の分散期に分けて考

    2022-01-14 02:18:49
  • html+js マークダウンエディタ効果

    マークダウン用プラグインEditor.mdのオフィシャルサイトです。 https://pandao.github.io/editor.md/ I: Editor.mdをダウンロードする 1: 公式サイトにアクセスして直接ダウンロードする githubのダウンロードアドレスです。 https://github.com/pandao/editor.md 2

    2022-01-14 02:15:50
  • src または css の背景画像の url 値を base64 でエンコードしたコード

    Webページ上の画像の中には、srcやcssの背景画像のurlの後に、例えば次のように大きな文字列があることにお気づきでしょうか。data: image/png; base64です。iVBORw0KGgoAAANSUhEUgnZVJlYWR5ccllPAAAhJREFUeNo8zjsOxCAMBFB/ KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b+Tlt9MY

    2022-01-14 01:54:06
  • フォームフォームのアクションとonSubmitの導入例

    まず、actionはフォームの属性で、html5では必須の属性値として定義されています。onSubmitはイベントで、 <input type="submit" /> で送信したときに検証する機能です。 2つ目:実行順序についてですが、私の個人的な理解では、onSubmitが先に来て、validateが先に来て、validationがfalseを返すと、action="url"のアド

    2022-01-14 01:49:03
  • HTML5 Blobによるファイルダウンロード機能のサンプルコード

    原理は、実際には非常に簡単ですが、バイナリにBlobの助けを借りて、テキストまたはJS文字列情報(つまり、背景には、サーバー上の特定のパスなしで動的ファイルに、エクスポートデータ機能などを返します)、次に、ダウンロード属性とタグのhref属性として、ダウンロード機能を実現するには、欠点は、ファイルが大きすぎると、失敗をダウンロードしている場合です。 データのエクスポートの例です。 $

    2022-01-14 01:44:41
  • 顔決済機能の実装をベースにしたHTML5+tracking.js

    最近、顔決済が非常にホットなので、もちろん上司もその流れに乗りたいので、顔決済のプロジェクトがあります。この記事では、HTML5環境に顔認証を実装する方法と、その開発過程で発生した問題点について解説しています。 1.カメラ1.1カメラを取得するために入力します。 html5でユーザーカメラを取得するには、inputを使用して、以下の2つの方法があります。 <input t

    2022-01-14 01:42:16
  • 画像処理におけるキャンバスの活用

    先日、前任者が面白いプロジェクトを薦めてくれました。TensorFlow.jsとcanvasの画像処理を使って、動画中の人の消失を実現する「Real-Time-Person-Removal」です。この機会に、canvasでの画像処理の基本をおさらいしておこうと思います。 基本API canvasの画像処理機能は、ImageDataオブジェクトを通してピクセルデータを扱います。主なAP

    2022-01-14 01:29:30
  • 主要サイトの問題のページの新しいオープニングかどうかタグは、照合を開くには

    タグで新しいページを開くかどうか。 (1)バイドゥ ヘッダーが異なる場合、ページを開き直す必要があり、ヘッダーが同じ場合、ページを新たに開くことができる、法律は不確かである (2)新浪のホームページ:ヘッダー部分は、現在のページで開かれ、関係なく、ヘッダーは、ジャンプの後に同じであるかどうか、他のコンテンツは、新しいページを開いています。Sina二次ページ:基本的に新しいページを開き、その一

    2022-01-13 23:52:02
  • 携帯電話のHtml5を達成するためにカメラのメソッドを呼び出すには

    入力呼び出しデバイスのビデオ、カメラなど... /{br HTML5の公式ドキュメントに説明があります。capture 属性は、デバイスのカメラまたはマイクを呼び出すために使用されます。 {と説明されています。 accept="audio/ or video/"の場合、captureの値は2つだけです。1つはuser用で、顔向きカメラ(例えば、電話の前面カメラ)を呼び出し、もう1つはenvi

    2022-01-13 23:51:31
  • 柔軟で安定した高品質のHTMLとCSSコード仕様の書き方ガイド

    ゴールデンルール 同じプロジェクトで何人が作業していても、常に同じコーディング仕様に従い、すべてのコードが同じ人によって書かれたように見えるようにする。 I. シンタックス 1. タブをスペース2個に置き換える。 2. 入れ子要素は1回インデント(空白2文字)する。   3. 属性定義には、必ず二重引用符を使用し、一重引用符は絶対に使用しないでください。   4. 自己完結型要素の末尾

    2022-01-13 23:36:54
  • HTML5 の数値入力コードで整数値のみを受け付けるようにする

    この2年間、これに関する記事や投稿をたくさん見てきましたが、本当にとても便利なものです。しかし、まだ穴のある実装、不自由な実装などが多すぎます。 全体的なコンセプトは理にかなっています。HTML 5の属性を使ってサーバーに送信できるものを制限し、Javascriptを使ってそれを強化し、ユーザーがそもそも入力できるものを制限するのです。 では、これらの問題点を踏まえて、より良い実装をしていきま

    2022-01-13 21:27:46
  • videoタグによるストリーミング読み込みのhtml5実装

    ビデオタグ ブラウザのvideoタグは通常src属性を受け取り、そのsrc属性に基づいてブラウザが自動的に動画を読み込む。 この処理は、ブラウザが動画を読み込む際に行われます。 この方法に問題はないのでしょうか? mp4ファイルをストリーミングで読み込むことができない Webm、flv、hls およびその他のフォーマットの互換性の問題 {について プレーヤーUIが醜すぎる、いくつかの一

    2022-01-13 20:40:23