BinaryDevelop

  • キャンバスを使った移動可能なグリッドの描画方法のサンプルコード

    この記事では、canvasを使った移動可能なグリッドの描画方法のサンプルコードを紹介し、以下のように共有します。 効果 画像 説明 これは実際のプロジェクトで遭遇した要件ですが、私はそれを抽象化し、ビジネス関連のものを遮断し、コードの観点のみから問題を考えました。まず、グリッドの大きさが設定可能で、各頂点が移動可能であること。この問題を見たとき、みなさんがどう考えているかはわかりません。まず

    2022-01-11 12:55:55

  • ラチェット式モーダルボックスの実装

    モーダルボックスは、どんなシステムのレイアウトにおいても重要なものです。本当はalert()を直接表示したほうがいいと思うのですが、最近はalert()のポップアップボックスが弱すぎると感じている人が多いようです。同時に、alert()は中にあまり多くのテキストを配置しないようにします。もし、このページ内で "サービス契約" の登録やその他のポップアップウィンドウを行う必要がある場合は、この際、

    2022-01-11 12:43:32

  • [CSSチュートリアル]CSSは、メソッドのさまざまな記事の分割行のスタイルの要約を達成するために

    この記事では、さまざまな方法で記事の分割線を達成するためにCSSを整理し、ページ内の分割線は、美化の役割を果たすことができ、その後、ラインスタイルを分割するためのさまざまな方法を達成するためにCSSの使用を見てみましょう。効果は次のとおりです。 方法1：セパレータを実装するタグを1つにする。 htmlを使用します。 <div class="line_01">Little sepa

    2022-01-11 12:23:35

  • [CSSチュートリアル】クールなネオン効果を実現するピュアCSS（デモあり）

    最近、tubeのCSS Animation Effects Tutorialシリーズを見ていると、面白いCSSエフェクトがたくさん紹介されています。その中でもネオンのエフェクトがかっこいいので、そのアイデアの実装について簡単な記録とシェアを紹介します。 これが実現したい効果です。 画像 ご覧のように、マウスをボタンの中に入れるとネオンのような光が発生し、マウスをボタンの外に出すと一定の軌跡（ボ

    2022-01-11 12:06:21

  • [css3]css3は、3つの方法のサンプルコードのテキストの点滅効果を達成するために

    1.透明度を変えることでテキストをちらつかせる、効果がある。 <!DOCTYPE html> <html> <head> </head> <title> text blinking</title> <body> <div class="blink"> A star's fire can start a

    2022-01-11 11:28:18

  • AmazeUI折りたたみカードレイアウト、統合コンテンツリスト、テーブルコンポーネント実装

    折りたたみ式のカードレイアウトはPC版では一般的ではないかもしれませんが、モバイル版では小さな画面でのWebブラウジングが光ります。 その AmazeUIでも、折りたたみ式のカードレイアウトを提供しています。公式サイトにも例がありますが、この折りたたみカードレイアウトは、コンテンツリストとテーブルコンポーネントを統合するための工夫が必要です。 例えば、以下の図では、AmazeUIの折りたたみ

    2022-01-11 10:21:43

  • HTML5入門(II)

    <ブロッククオート この記事 Grapevineテクニカルチームによる 原作・初出 新しいHTML5コンテンツと基本的なページレイアウトについては、すでに前回の記事で紹介しました 今回の記事では、引き続き広義のHTML5のもう一つの構成要素を紹介します。JavaScript のデータ型です。 弱定型言語であるJavaScriptの優れた点は、動的に型付けされる

    2022-01-11 10:17:57

  • キャンバスは、ビデオの最初のサムネイルを取得します。

    クエリを記録し、最近再ウォッチキャンバスで時間は、もはやこの問題がない場合、標準としてW3Cの更新に、2019年11月5日に書かれているようにいくつかのDemoを行うには、これは単に参照です キャンバスのビデオの最初のフレームを表示しようとすると、問題が触れた：Chromeで、ビデオで。Firefox の同じコードでは、ロードされていないビデオの最初のフレームを取得し、それをキャンバスにレンダリ

    2022-01-11 10:08:52

  • HTML5におけるCSSアピアランスプロパティの説明

    CSS 外観属性 1. 色：文字色 役割 color属性は、テキストの色を定義するために使用されます フェッチメソッド。 注：実際には16進数表記が最も多く、赤は#f00のように省略された表記が好まれます。 2. text-align：テキストの水平方向の位置揃え。 役割 text-align属性は、テキストコンテンツの水平方向の配置を設定する

    2022-01-11 10:06:12

  • HTML5 ドラッグ＆ドロップの具体的な使用方法について

    はじめに Drag/Dropは、オブジェクトを掴んで好きな場所に配置する、非常に一般的でよく使われる操作です。H5では、ドラッグ＆ドロップは標準的な操作で、どんな要素でもドラッグすることができます。しかし! ドラッグ＆ドロップを実装するには、ドラッグ＆ドロップ属性を追加する必要があります。 H5でのドラッグ＆ドロップ属性：dragable: auto | true | false

    2022-01-11 09:28:41

  • [css3]css3は、背景画像の色を変更するためのさまざまな方法を実現するために

    css3は画像の色を変更できるようになりました。これからは、複数の画像をデザインする必要がなくなり、いつでも修正できるようになりました。css3で背景画像の色を変更する効果を行う方法を簡単に説明します。 方法1 css3 filterfilter でドロップシャドウを使用する。 コードは以下の通りです。 ERROR: Unable to write in /opt/module/hadoo

    2022-01-11 08:55:24

  • amazeuiのページチェック機能を実装するためのコード

    下図のように Postal "郵便番号"フィールド、データベース内のvarchar2 (10)。 しかし、amazeuiのページバリデーションでは、文字長に対して以下のようなバリデーションが行われています。 JSフォームバリデーション JSのフォーム検証は、HTML5の検証属性に基づくものです。 required : 必要です。 patte

    2022-01-11 07:20:44

  • [CSSチュートリアル】CSS3で3つの効果例の背景をぼかす。

    始めずに、本題に入りましょう。 通常の背景ぼかし効果は以下の通りです。 属性を使用します。 filter:(2px) 通常の背景ぼかし 背景の前のテキストは美観上ぼかすことができず、filterプロパティによってdivの子孫全体がぼかされ、さらに白いボーダーがつくことになります。つまり、この効果を得ることは不可能なのです。どうすればいいのでしょうか？擬似要素を使えばいいのです。これも白い

    2022-01-11 06:43:21

  • amazeuiのツリーノード自動展開パネルの実装と、最初のツリーノードの選択

    適用対象：amazeui.tree バージョン：不明（2018年10月現在） Amaze UI TreeはAmazeフレームワークの拡張機能で、メリットはスタイルがAmazeフレームワークと統一されていること、デメリットは非常に不完全なこと、プロジェクトで適用できるようにするために、そのコアコードを修正しました（ここではなく、別の記事で公開します）。選択されたツリーノード関数のAPIは、繰

    2022-01-11 06:06:24

  • モバイルHTML5開発ツール vconsoleの詳細解説

    モバイル向けの開発では、PC向けの開発とは異なり、様々なネットワークリクエストや出力されるログを確認するためのコンソールがあると便利です。 そこでTencentチームは、PC上のコンソールをエミュレートするツールを開発し、印刷ログはもちろん、ネットワークリクエストやLocalstorageまで情報を見ることができるようにしました。 使用方法 yum inst

    2022-01-11 05:56:30

  • キャンバスをベースにしたHTML5で電子署名を実現、PDF文書も生成可能

    プリアンブル 電子署名とは、一般に技術的手段により電子文書に読み込まれた電子形式の署名のことであり、その役割は手書きの署名や紙の契約書への公印と同様である。電子署名の合法性については長年疑問視されてきましたが、企業のワークフロー承認や招待状、文書保存などの場面で広く利用されており、最近のプロジェクトでもこのような手書き署名やPDF文書生成のニーズがあります。 実装の考え方 キャンバスを使って

    2022-01-11 05:15:51

  • HTML5で音声や動画を読み込むためのコード

    [I. 前書き Flashを使用しないネイティブなオーディオやビデオのサポートを含むHTML5の機能。 HTML5の<audio>と<video>タグを使用すると、サイトにメディアを簡単に追加することができます。src 属性でメディア リソースを特定し、controls 属性でメディアの再生と一時停止ができるようにするだけです。 [II.動画の埋め

    2022-01-11 04:59:28

  • Canvasでグラフィックス/イメージバインディングのイベントリスナーを実装する方法

    HTMLはリスナー関数を要素/タグにのみバインドすることができます。 キャンバス描画の要素は1つだけです - キャンバスです。各図形/画像は要素ではないので、直接イベントバインディングすることはできません。 解決策 「イベントデレゲーション」 - キャンバスにすべてのイベントをリッスンさせ、イベント発生の座標点、および特定のグラフィック/イメージの範囲内にあるかどうかを計算させる。 イベント

    2022-01-11 04:58:41

  • HTML5のmeta viewportパラメータの解析

    モバイルの普及に伴い、モバイルでのリファクタリングやWebサイトの開発が急務となっています。しかし、モバイルデバイスのメタビューポートパラメータを理解して初めて、私たちのWebページをモバイルデバイスのさまざまな解像度にうまく適応させたり、レスポンシブ化したりすることができるのです。 ビューポートとは何ですか？平たく言うと、ビューポートとは、ユーザーのウェブページが見える範囲のことです。モバイル

    2022-01-11 04:51:04

  • HTML5 canvas の静的スクロール・ポップアップ

    この記事では、以下のように共有されるHTML5 canvasの静的ループスクロールポップアップの実装を紹介します。 使用方法とAPI 構文は以下の通りです。 canvasBarrage(canvas,data)。 ここで キャンバス hwndCalc = FindWindow(0&, " Calculators ") とは {{コード canvas 要素は、直接の D

    2022-01-11 04:50:10

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します