ホーム> Web デザインのチュートリアル
すべて Dreamweaver チュートリアル JavaScript チュートリアル HTMLチュートリアル CSS チュートリアル ヒントとコツ DHTML チュートリアル ウェブ特殊効果 WEB標準化
Web デザインのチュートリアル
  • css+jsで部分領域強調表示と編集可能なマスクレイヤーを実現

    css+jsで部分領域強調表示と編集可能なマスクレイヤーを実現

    cssやjqueryで実装できるマスクレイヤーなどの一般的な機能は皆さんもやったことがあるかと思いますが、ここではhttp://プロジェクトで実装した方法を紹介します。操作可能で、非常に実用的です。 効果は次のとおりです。 js 実装部分: 次のようにコードをコピーします。
    2025-01-29
  • HTML5キャンバス描画の基本的な使い方を詳しく解説

    HTML5キャンバス描画の基本的な使い方を詳しく解説

    <canvas></canvas>は HTML5 の新しいタグで、グラフィックを描画するために使用されます。実際、このタグの特別な特徴は、このタグが JavaScript スクリプトを通じて制御できる CanvasRenderingContext2D オブジェクトを取得できることです。
    2025-01-29
  • HTML5 地理位置情報を使用して距離トラッカーを実装する

    HTML5 地理位置情報を使用して距離トラッカーを実装する

    HTML5 地理位置情報は、ユーザーの位置を特定するために使用されます。では、距離トラッカーを実装するにはどうすればよいでしょうか?私のアイデアは、ブラウザが h5 地理位置情報をサポートしていることを前提としています。これに基づいて、ユーザーの位置が取得され、距離が計算され、ページに表示されます。単に実装されただけです。
    2025-01-29
  • キャンバスベースのビデオマスクプラグインの詳細説明

    キャンバスベースのビデオマスクプラグインの詳細説明

    ビデオにオーバーレイを追加すると、ビデオの特定の期間(10 分から 20 分など)の間、区切られた領域が表示されなくなります。アプリケーション シナリオには、衛星 TV アイコンのブロック、ビデオの右下隅の広告のブロック、モザイクとしての機能などが含まれます。長いビデオには、それぞれに特定の表示時間が指定された複数のマスクが含まれる場合があります (ここでは
    2025-01-29
  • JSは数値を3桁のカンマ区切り形式に変換します(サンプルコード)

    JSは数値を3桁のカンマ区切り形式に変換します(サンプルコード)

    次のようにコードをコピーします。 function formatNum(num){ if(!/^(/+|-)?(/d+)(/./d+)?$/.test(num)){alert("wrong!" ) ; 戻り値;} var a = RegExp.$
    2025-01-29
  • select の現在値を取得する JavaScript のサンプルコード (IE/Firefox/Opera/Chrome 互換)

    select の現在値を取得する JavaScript のサンプルコード (IE/Firefox/Opera/Chrome 互換)

    JavaScript は、Select の現在の値を取得します: var value = document.getElementById("select").options[document.getElementById("select").options。
    2025-01-29
  • クライアントがiOSやAndroidなどのモバイル端末であるかを判定するjsメソッド

    クライアントがiOSやAndroidなどのモバイル端末であるかを判定するjsメソッド

    判断原理: JavaScript はフロントエンド開発の主な言語です。JavaScript プログラムを作成することでブラウザの種類とバージョンを判断できます。 JavaScript がブラウザの種類を判断するには、一般に 2 つの方法があり、1 つはさまざまなブラウザの固有の属性に基づいて区別する方法、もう 1 つはブラウザの userA を分析する方法です。
    2025-01-29
  • JSを使用してキーボードの上下左右キーを制御する(サンプルコード)

    JSを使用してキーボードの上下左右キーを制御する(サンプルコード)

    これは基本的な JS コードです。JS を学びたい人は、JS を使ってキーボード全体を制御するのが最適です。これは非常に興味深いでしょう。具体的なコードは次のとおりです。 コードをコピーすると、コードは次のようになります。 <style>tr.highlight{background:#08246B;color:whi
    2025-01-29
  • HTML5のドラッグ&ドロップ機能を実装したパズルゲーム

    HTML5のドラッグ&ドロップ機能を実装したパズルゲーム

    具体的なコードは次のとおりです。 <!--代码如下,最下面给出了我测试用的9张250*250的图片切片--><!DOCTYPE html><html><head><meta charset=utf-8><title>ドラッグドラッグ
    2025-01-28
  • JavaScriptで文字列を定義するサンプルコード

    JavaScriptで文字列を定義するサンプルコード

    次のようにコードをコピーします。<html><head><title> JavaScriptでの文字列の定義</title><script> //定义字符串 //第一种 var str = new Array(); alert(str);//空字符
    2025-01-28
  • ランダムな宝くじコード効果を達成するためのjs宝くじ

    ランダムな宝くじコード効果を達成するためのjs宝くじ

    ランダムに選ばれたシンプルなコード。次のようにコードをコピーします。<html><title>ランダム抽選手順</title><head><meta http-equiv=Content-Type content="text/html; charset=gb2312">
    2025-01-28
  • プロンプトを表示せずに Web ページ ウィンドウを直接閉じるための JS サンプル コード

    プロンプトを表示せずに Web ページ ウィンドウを直接閉じるための JS サンプル コード

    IE7 と IE8 では、JavaScript が提供する close() メソッドを使用して現在のウィンドウまたはタブを閉じることができますが、コードを探した後、最終的にプロンプ​​トを表示せずに直接閉じることができます。 JavaScript コードのコピー コードは次のとおりです。 function CloseWin() {
    2025-01-28
  • HTML5 を使用して全画面ビデオ背景を簡単に実装する方法の例

    HTML5 を使用して全画面ビデオ背景を簡単に実装する方法の例

    ホームページでビデオを全画面で再生したいですか?このビデオは Web ページの背景として使用されており、Web コンテンツの通常の閲覧には影響しません。それでは、あなたのニーズに合った Javascript ライブラリがあることをお知らせします。それが Bideo.js です。自動調整機能: Bideo.js は、現在のブラウザ ウィンドウのサイズに応じてビデオ サイズを自動的に調整できます。
    2025-01-28
  • Canvas+Vueをベースにした弾幕コンポーネントの実装

    Canvas+Vueをベースにした弾幕コンポーネントの実装

    最近、プロジェクトで弾幕機能をカスタマイズする必要があったため、キャンバスを使用してコンポーネントを開発してみました。テストした結果、一部のローエンドマシンでは効果に明らかな遅れはありませんでした。弾幕エフェクト機能の紹介を共有します。弾幕の送信数をサポートします。 npm i vue-barrage パラメータの設定。
    2025-01-28
  • js で整数を検証し、小数点を保持する簡単な例

    js で整数を検証し、小数点を保持する簡単な例

    次のようにコードをコピーします: function validateNum(obj) {//正の整数 (ここでキャッシュが使用されます) var number = obj.data(validate).number;// 小数点 (ここでキャッシュが使用されます) var decmal = obj.d
    2025-01-28