-
html5のfigureとfigcaptionの使い方
figureタグとfigcaptionタグは、html5で追加された新しいセマンティックタグです。 html5のセマンティックタグであるfigureタグ。 単体のストリームコンテンツ(画像、図表、写真、コードなど)を指定するために使用します。 figcaption タグ、html5 のセマンティックタグです。 figure と共に使用し、定義の figure 要素
2022-02-01 12:44:52 -
HTML5動画再生(動画),JavaScript制御動画サンプルコード
具体的なコードは以下のとおりです。 <html lang="en"> <head> <meta charset="UTF-8"> <title>Documenttitle> <style> figcaption { text-align: center; line-height: 150px; font-family:
2022-02-01 12:30:12 -
HTML5 における dialog 要素のテイスト
ダイアログ(また、モーダルボックス、フローティング層として知られている)ユーザーとの対話のためのWebプロジェクトの重要な部分である、我々は最も一般的にアラート()、jsで()を確認しますが、このダイアログが美しくないとカスタマイズすることはできませんので、開発の過程で、一般的にホイールを構築したり、サードパーティを使用して、自分のニーズによると、。 ダイアログボックスの構成 一
2022-02-01 12:04:17 -
[CSSチュートリアル]css transform ページめくりアニメーションの記録
ページめくり問題シナリオ BとCが同じページ(表と裏)にある Aをページオーバーしようとすると、BとCはAを上書きしてDを表示するために両方をページオーバーする必要があります。 BとCは同じボックスには書けません エラーの例 <div class="pagesBox A"></div> <div class="pages
2022-02-01 11:54:50 -
[CSSチュートリアル]CSSのボーダーの半分または部分的に見えるコードは、ボーダーを達成するために
1. 擬似クラスを使ってボーダーを半分見えるようにする Concepts String buffers, buffers are used to store data, so they are also called containers. The principle of string composition is implemented by this class. (Used fo
2022-02-01 11:14:57 -
HTML5 動画再生プラグイン video.js のご紹介
video.jsは、非常に人気のあるhtml5ビデオプラグインです。それは携帯電話でビデオを再生するために非常に適している(例えば、WeChatのWebページ)、強力で、フラッシュへのダウングレードをサポートしています、ie8と互換性があります。 http://videojs.com/ git&demo : http://files.cn
2022-02-01 09:50:56 -
キャンバスで画像を圧縮し、カードを作成する例
イベントページなどをやっていると、画像をアップロードする必要があったり、生成したテキストとステッカーでカードを生成して、ユーザーが長押しして保存する必要があったりすることがよくあります。この要件は以前にも一度ありましたが、最近またそれに出会い、canvasを使って実現しました。単純にブログのアウトを整理する もし、もっと良い実装方法があれば、一緒に議論してください。 canvasで画像
2022-02-01 09:33:57 -
キャンバスサーチライトエフェクトのサンプルコード
canvas の clip() メソッドは、元の canvas から任意の形状や大きさを切り取るために使用されます。いったん領域が切り取られると、それ以降の描画はすべて切り取られた領域に制限されます (キャンバスの他の領域にはアクセスできません)。 また、clip() メソッドを使用する前に save() メソッドを使用して現在のキャンバス領域を保存し、後で restore() メソッドを
2022-02-01 09:20:51 -
HTML5 postMessage使用マニュアル
コーディングをしていると、次のようなクロスドメインのシナリオに遭遇することがよくあります。 1、ページ内にiframeをネストさせ、iframeのメッセージングを行う。 2、ページ間、複数ページ間のメッセージの受け渡し これらの頭痛の種であるクロスドメインの問題に対して、html5は特別に新しい機能であるpostMessage(クロスドキュメントメッセージング)を導入しました。
2022-02-01 07:04:50 -
[CSSチュートリアル】大きな画像や情報を小さなドロップダウンで実現するCSS
今日はタオバオや京東などのショッピングモールでよく使われている、小さな写真にカーソルを合わせると大きな写真や情報が表示されるcssの効果についてお話します。 できれば、シャドウやディレイ効果なども設定できると思うので、よかったら過去のcssエフェクトの例もチェックしてみてください デザインのアイデアも非常にシンプルで、最初に下の大きな絵を隠しておいて、小さな絵がホバー
2022-02-01 06:53:34 -
HTML5サインイン機能
紹介 H5のユーザーサインインの例(css+jquery、画像なし)ネットで見つけたユーザーサインインの例は、画像が多かったり冗長なコードで構成されていたりで、あまり良くないので、あえてサインインのインターフェース(モバイル)を作りました。 h5を使用し、css + jquery + htmlのみで構成されたモバイル用ユーザーサインサンプルページです。 デモ htt
2022-02-01 06:41:15 -
HTML5でjsonオブジェクトを使用するためのサンプルコード
次のコード例では、HTML5でjsonオブジェクトを使用する方法を紹介します。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, height=devi
2022-02-01 06:18:57 -
ウェブアプリのページスクロールラグの解決策を詳しく解説
モバイルブラウザが現在のページをスクロールしているとき(場合によってはページのズームも)、デフォルトの動作がブロックされ、ページが強制的に静止するため、ページをスクロールするときに吃音感があり、ユーザーエクスペリエンスが低下します。 具体的には、touchstart イベントオブジェクトは true cancelable プロパティを持っているので、リスナーは preventDefault
2022-02-01 05:24:27 -
HTML5タイマーrequestAnimationFrameの使い方を深く理解する。
プリアンブル javascriptのアニメーションでは、常にタイマーが中心となっています。そして、アニメーションのループを書く上で重要なのは、どの程度の遅延が適切かを知ることです。一方では、ループの間隔は、さまざまなアニメーション効果がスムーズで流動的に見えるように十分に短くなければなりません。一方では、ループの間隔は、ブラウザが結果の変化をレンダリングする能力を確実に持つように十
2022-02-01 03:41:10 -
HTML5によるメッセージ通知の利用(Web Notification)
HTML5に関する記事をたくさん書いてきましたが、いつも思うのは、高度なAPIはすべてスルーしなければいけないということです。システムを理解し、より高いレベルから考えることで、より少ない労力でより多くのことを成し遂げられるようになることが重要なのです。 最初の外観 まず、一番簡単な例として chrome デベロッパーツールにコードを貼り付けて、以下のように直接実行します。
2022-02-01 03:33:51 -
html5 postMessageのフロントエンドクロスドメインとフロントエンドのリスニング方式の例
時には、フロントエンドでシングルサインオンをしろ!などという馬鹿げた要求もあります。要件を受けたら、解決策を考えなければなりません。 ここで、簡単なフロントエンドのシングルサインオンソリューションを作ってみましょう。 postMessageのクロスドメインメッセージングとonstorageのリスニングを使用しています。 この記事で使用した知識: KOA 静的リソースサービス
2022-02-01 01:30:13 -
HTML5新タグの互換性 --> <! --<if lt IE 9><!endif--> の2つの方法があります。
1つ目の方法 (html5shivを使用) <! --[if lt IE9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <! [endif]--> 国内のgoogleサーバーアクセスカードの関係で、国内のcdnを
2022-02-01 01:07:30 -
HTML5新フォームコントロールとフォームプロパティのサンプルコード詳細
最初の知識ポイント:フォームプロパティと概要 第二の知識:H5の新しいフォームコントロールとプロパティ、および要約 1つ目のナレッジポイント よく見かけるフォームバリデーションにはどのようなものがあるか テキスト テキストボックスのラベル パスワードパスワードボックス チェックボックス マルチセレクトボックス ラジオ ラジオボック
2022-01-31 23:30:43 -
data:画像データのurlファイルをBlobアップロードバックエンドメソッドに渡す。
キャンバスから取得した画像や、WeChat開発用SDKからdata:img形式で返された画像など、サーバーにアップロードする必要がある場合、変換が必要なシナリオがあります。 dataURLをBlobに変換する // base64 to blob dataURItoBlob(dataURI) { // convert base64/URLEncoded data component
2022-01-31 23:19:44 -
Canvasでプログレスバー付きの非閉鎖円を描画する
最終結果 I. 変数の定義 半径の定義、円の太さの定義、円の中心の定義、デフォルトの塗りつぶし色の定義 let radius = 75 let thickness= 10 let innerRadius = radius - thickness let x = 75 let y = 75 var canvas = document.getElementById(
2022-01-31 22:18:19
最新
-
LinuxでインターフェースのIPアドレスを取得する
-
WPFでリソースであるアイコンを使用するにはどうすればよいですか?
-
Laravel 6.0での「未定義関数str_slug()の呼び出し」について
-
WildFlyのヒープメモリを増やすには?
-
MessageBox.Showダイアログの「はい」「いいえ」ボタンのテキストを変更するには?
-
FlutterでキーボードのText Input Action Button(return/enterキー)を変更するには?
-
同一線上にある2つのdivブロック
-
ナビゲーションバーの右側に複数のUIBarButtonItemを追加するには?
-
絶対配置を使用することはバッドプラクティスとみなされますか?[クローズド]
-
リアクト転写小道具(1個を除く
おすすめ
-
Eclipse で Maven プロジェクトを作成すると、「Could not resolve archetype」というクレームが発生する [重複] 。
-
ドロップダウンリストのselecteditemをプログラムで設定する
-
切り上げ/切り下げ 瞬間を分単位で表す
-
kubernetesを完全にアンインストールする方法
-
Laravelが更新後に「The bootstrap/cache directory must be present and writable」エラーを投げる。
-
LinearLayoutに子要素がある場合、onClickがトリガーされない
-
アンドロイド マシュマロ。Espressoでパーミッションのテスト?
-
車輪の再発明をせずにREST APIを保護する
-
Jenkinsパイプラインで失敗したステージのリトライオプションを実装するには?
-
がチェックアウトされていない...バンドルインストールしても直らない!