ホーム>Web デザインのチュートリアル> HTMLチュートリアル
すべて Dreamweaver チュートリアル JavaScript チュートリアル HTMLチュートリアル CSS チュートリアル ヒントとコツ DHTML チュートリアル ウェブ特殊効果 WEB標準化
HTMLチュートリアル
  • Html5でBaiduとAmap APPを起動する実装例

    Html5でBaiduとAmap APPを起動する実装例

    数日前、United Black Card が H5 で Baidu APP または Amap APP を開く必要があると報告したため、オンラインで関連文書を確認し、以下のリンクを貼り付けました。 1. Amap 2. Baidu Map の具体的なアイデア クリックして地図を選択したとき、最初に APP リンクを要求すると、800 ミリ秒が経過しても応答がなく、その後 H5 リンクにジャンプします。このようにしてください
    2025-01-27
  • html5 キャンバスは放射性グラデーション カラー効果を描画します

    html5 キャンバスは放射性グラデーション カラー効果を描画します

    Canvas にはまだ落とし穴がいくつかあります。たとえば、fillRect は属性ではなくメソッドです。fillRect= を記述しても、効果はなく、エラーも報告されません。ここでは createRadialGradient API が使用されます。この API は 6 つのパラメータを受け取り、最初の 3 つは下部の円、背面を表します。
    2025-01-27
  • HTML5はモバイル端末に最適な記述方法を実現

    HTML5はモバイル端末に最適な記述方法を実現

    PC 版 Web ページ (http://pc_url) で、以下を追加します。<link rel=alternate media=only screen and(max-width: 640px) href=http://pc_url >モバイル版のページ (http:/
    2025-01-26
  • キャンバステキストの衝突検出と間引き方法

    キャンバステキストの衝突検出と間引き方法

    要件の背景 テキストの細線化は、マップ関連の要件を作成するときに一般的に使用されます。このメソッドは、会社のマップ エンジンの機能を実装するときにのみ実装されました。この操作は、マップの概念を導入しません。衝突検出は、キャンバス内のテキストが占める範囲を計算します。 // 計算
    2025-01-26
  • HTML5レコーディングの落とし穴を詳しく解説

    HTML5レコーディングの落とし穴を詳しく解説

    私が少し前に取り組んだプロジェクトは、オーディオ コースウェアを開発することでした。基本的に、ドキュメント、画像、その他のリソースをインポートすると、ページが PPT のようなレイアウトになり、画像を選択してオーディオを挿入できるようになります。 - ページ編集とグローバル編集の 2 つのモード。オーディオをインポートするには 2 つの方法があります。1 つはリソース ライブラリからインポートする方法、もう 1 つはリソース ライブラリからインポートする方法です。
    2025-01-26
  • HTML5 Canvasによるショッピングモール監視事例を詳しく解説

    HTML5 Canvasによるショッピングモール監視事例を詳しく解説

    国内経済の急速な発展に伴い、人々の安全に対する要求はますます高まっています。次のような事態が起こらないようにするために、セキュリティ システムの導入を検討する必要があります。 証拠と手がかりの提供: 多くの工場、銀行、盗難、事故では、関係機関がビデオ情報に基づいて事件を検出できます。これは非常に重要です。手がかり。紛争や事故の中には、ビデオで簡単に記録できるものもあります。
    2025-01-26
  • 固定HTMLテーブルヘッダーの実装

    固定HTMLテーブルヘッダーの実装

    この記事では、HTML Table ヘッダー固定の実装を紹介し、皆さんと共有します。詳細は次のとおりです。<div class=wrapbox><div class=table-head><table><thead>
    2025-01-26
  • Canvas を使用して画像ダウンロード機能を実装し、ブラウザの互換性の問題を解決します。

    Canvas を使用して画像ダウンロード機能を実装し、ブラウザの互換性の問題を解決します。

    はじめに: 画像のダウンロード機能をプロジェクトに実装する必要がある場合、最初に思いつくのは、 a タグの download 属性を使用することです。ただし、別のブラウザーでテストすると、一部のブラウザーでは問題が発生することがわかります。は無効であり、クリックすると画像が直接プレビューされます。そのため、さまざまなブラウザーと互換性のある画像をダウンロードする別の方法を見つけました。それは、canvas を使用して画像を処理することです。
    2025-01-26
  • HTML5オリジナルテトリス(キャンバスベース)

    HTML5オリジナルテトリス(キャンバスベース)

    初めてテトリスを書いたのは 1 年以上前で、つい最近まで JS を学んだばかりでした。 js への理解を深め、ゲームへの愛情をさらに高めるために、他の人のアイデアやコードを参照せずに、最も基本的な js コードを使用してキャンバスに基づいてテトリスを作成しました。 3年生の夏休みにes6の構文を使って改良を加えました。
    2025-01-26
  • HTML5 Canvasを使用して360度パノラマを実装するサンプルコード

    HTML5 Canvasを使用して360度パノラマを実装するサンプルコード

    多くのショッピング Web サイトは現在、実際のオブジェクトの 360 度のパノラマ画像をサポートしており、購入者にとっては優れた消費エクスペリエンスです。jQuery に基づいたプラグインもあり、一部は有料です。はい、実際には 3deye.js という非常に便利なプラグインがあります。プラグインはデスクトップおよびモバイル端末をサポートします
    2025-01-26
  • HTML5 模倣 WeChat チャット インターフェイスと WeChat Moments サンプル コード

    HTML5 模倣 WeChat チャット インターフェイスと WeChat Moments サンプル コード

    ここ数日、H5 を使用して WeChat 風のチャット フロントエンド インターフェイスを開発しました。特に WeChat の下部エディターは、WeChat ほど包括的ではありませんが、非常にうまく処理されています。 、それでもかなり優れています。メッセージ、絵文字を送信したり、送信したメッセージを自動的に下にスクロールしたり、メッセージ、写真、ビデオに対して異なる右クリック処理を実行したりできます。
    2025-01-26
  • Html5キャンバスをベースに、写真のトリミングやモザイク機能、Youpaiyunへの写真アップロード機能を実現

    Html5キャンバスをベースに、写真のトリミングやモザイク機能、Youpaiyunへの写真アップロード機能を実現

    1. コア機能 このコンポーネントの機能は次のとおりです。 画像のトリミング (トリミング ボックスをドラッグすると、トリミング ボックスのサイズが変更されます)。 画像のモザイク (モザイクの描画、モザイクの解除)、画像の復元 (元の画像に戻す、元の画像に戻す)。処理された画像); 画像のアップロード (署名の取得、写真のアップロード)。 2. コアロジック 2.1 クロップ枠(長方形)を取得するための画像クロップ
    2025-01-26
  • Canvasにイベントを追加する方法の例

    Canvasにイベントを追加する方法の例

    フロントエンドとして、要素にイベントを追加するのは一般的なことです。しかし、Canvas ではイベントの追加はおろか、そこに描かれたものは何も取得できないので、それについては無力なのでしょうか。もちろん違います!私たちは日々のプロジェクトで多くの Canvas フレームワークを使用していると思いますが、これらのフレームワークでイベントが使用されていることがわかりました。
    2025-01-26
  • pre や textarea などの HTML 要素でスクロール バーを削除し、自動的に行を折り返し、テキスト コンテンツの高さを調整する方法

    pre や textarea などの HTML 要素でスクロール バーを削除し、自動的に行を折り返し、テキスト コンテンツの高さを調整する方法

    HTML の Pre および textarea では、事前にフォーマットされたテキストを表示できます。つまり、スペースと改行を保持します。などの HTML 要素を追加する代わりに、改行や印刷スペースを追加します。 pre がスクロール バーを削除すると、pre はテキスト コンテンツを表示しますが、この時点では CSS を追加して問題を解決できます。<pre>私たちの
    2025-01-25
  • HTML5ページの実装メソッドを返す

    HTML5ページの実装メソッドを返す

    このタイトルを見ると、何だこれはと思うかもしれません。 実際、私が言いたいのはこれです。以下の記録を見てください。この種のインタラクションは、H5 ページのいたるところにあります。都市をクリックすると、都市選択のフローティング レイヤーがポップアップ表示され、戻るボタンを押してフローティング レイヤーが閉じます。層。これらの操作は、左上隅/右上隅の閉じるボタンをクリックしなくても実行できます。Fliggy’s H5 では、進むときと戻るときにポップアップ レイヤーが表示されます。
    2025-01-25