ホームページ ウェブフロントエンド htmlチュートリアル Effeckt.css プロジェクト: CSS インタラクティブ アニメーション アプリケーションのコレクション_html/css_WEB-ITnose

Effeckt.css プロジェクト: CSS インタラクティブ アニメーション アプリケーションのコレクション_html/css_WEB-ITnose

Jun 24, 2016 pm 12:05 PM
交流 アニメーション プロジェクト

現在、インターネット上には CSS 変換に基づく実験や例が多数ありますが、それらはすべて散在しすぎています。Effeckt.css の目標は、次のような CSS/jQuery アニメーションに基づくすべてのアプリケーションを一元化することです。 -up ウィンドウ、ボタン、ナビゲーション、リスト、ページ切り替えなど。

Effeckt.css は、ポップアップ ウィンドウ、ボタン、ナビゲーション、リスト、ページ切り替えなど、Web サイトとモバイル Web 開発の両方に適した、多くの新鮮で実用的な CSS/jQuery アニメーション効果アプリケーションのコレクションです。特殊効果アニメーションは Web サイトのユーザー エクスペリエンスを向上させることができ、シンプルで実用的です。

デモページ: http://h5bp.github.io/Effeckt.css/dist/

プロジェクトの本来の意図

モバイル Web サイトの UI の開発と設計は、特に次の場所で送信される場合、簡単な作業ではありません。 60fpsで実行可能。理想的なアプローチは、携帯電話/タブレット向けの CSS トランジションとキーフレーム アニメーションに基づいてジャンクのない変換を実行し、特にハードウェアと透明性の変更を利用して変換を高速化することです。

現在、インターネット上には CSS 変換に基づいた実験や例がたくさんありますが、それらはすべて分散しすぎており、Effectkt.css の目標は、CSS/jQuery アニメーションに基づいたすべてのアプリケーションを一元化することです。应用体

特定のアプリケーション:

Tympanus.net/Development/ModalWindowEffects/Tympanus.net/DEVELOPMENT/PAGETRANSITIONS/

Tympanus.net/Development/PFOL D/Index2.html
  • Leaverou.github.io/Animatable/
  • lab.hakim.se/ladda/
  • lab.hakim.se/kontext/
  • lab.hakim.se/avgrund/
  • lab.hakim.se/meny/
  • プロジェクト目標
  • :
  • UI Less,トランジション/アニメーションのみに焦点を当てます。

    エレガントで合理的な動的効果を備えます。

    CSS パフォーマンス回帰テストを作成します。
  • 機能が満たされない場合。パフォーマンス目標を達成するには、この機能を除外できます
  • 他のスタイル要素への影響を回避する方法に関するガイドラインがあります (高価な CSS を避ける)
  • ユーザーがニーズに応じて CSS をプッシュできるように、ビルダーを提供します
  • モバイルデバイス ホバー効果はありません, そのため、それらに基づくホバー効果は除外されるか、クリック アクション効果が発生します。
  • Effeckt.css の詳細については、こちらをご覧ください: https://github.com/h5bp/Effeckt.css
  • 問題の相談とフィードバック: http://github.com/h5bp/Effeckt.css/issues
  • 国内ミラーアドレス: https://code.csdn.net/OS_Mirror/Effeckt.css
  • このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

    ホットAIツール

    Undresser.AI Undress

    Undresser.AI Undress

    リアルなヌード写真を作成する AI 搭載アプリ

    AI Clothes Remover

    AI Clothes Remover

    写真から衣服を削除するオンライン AI ツール。

    Undress AI Tool

    Undress AI Tool

    脱衣画像を無料で

    Clothoff.io

    Clothoff.io

    AI衣類リムーバー

    AI Hentai Generator

    AI Hentai Generator

    AIヘンタイを無料で生成します。

    ホットツール

    メモ帳++7.3.1

    メモ帳++7.3.1

    使いやすく無料のコードエディター

    SublimeText3 中国語版

    SublimeText3 中国語版

    中国語版、とても使いやすい

    ゼンドスタジオ 13.0.1

    ゼンドスタジオ 13.0.1

    強力な PHP 統合開発環境

    ドリームウィーバー CS6

    ドリームウィーバー CS6

    ビジュアル Web 開発ツール

    SublimeText3 Mac版

    SublimeText3 Mac版

    神レベルのコード編集ソフト(SublimeText3)

    CSS アニメーション: 要素のフラッシュ効果を実現する方法 CSS アニメーション: 要素のフラッシュ効果を実現する方法 Nov 21, 2023 am 10:56 AM

    CSS アニメーション: 要素のフラッシュ効果を実現する方法、具体的なコード例が必要です。Web デザインでは、アニメーション効果がページに優れたユーザー エクスペリエンスをもたらすことがあります。グリッター効果は、要素をより目を引くようにできる一般的なアニメーション効果です。 CSSを使って要素のフラッシュ効果を実現する方法を紹介します。 1. フラッシュの基本的な実装 まず、フラッシュ効果を実現するには、CSS のアニメーション プロパティを使用する必要があります。アニメーション属性の値には、アニメーション名、アニメーション実行時間、アニメーション遅延時間を指定する必要があります。

    AIはフェルマーの最終定理を克服できるか?数学者は100ページの証明をコードに変えるために5年間のキャリアを放棄した AIはフェルマーの最終定理を克服できるか?数学者は100ページの証明をコードに変えるために5年間のキャリアを放棄した Apr 09, 2024 pm 03:20 PM

    フェルマーの最終定理、AIに征服されようとしている?そして、全体の中で最も意味のある部分は、AI が解決しようとしているフェルマーの最終定理は、まさに AI が役に立たないことを証明するものであるということです。かつて、数学は純粋な人間の知性の領域に属していましたが、現在、この領域は高度なアルゴリズムによって解読され、踏みにじられています。画像 フェルマーの最終定理は、何世紀にもわたって数学者を悩ませてきた「悪名高い」パズルです。それは 1993 年に証明され、現在数学者たちはコンピュータを使って証明を再現するという大きな計画を立てています。彼らは、このバージョンの証明に含まれる論理的エラーがコンピュータによってチェックできることを望んでいます。プロジェクトアドレス: https://github.com/riccardobrasca/flt

    PyCharm プロジェクトをパッケージ化する簡単な方法を共有する PyCharm プロジェクトをパッケージ化する簡単な方法を共有する Dec 30, 2023 am 09:34 AM

    シンプルでわかりやすい PyCharm プロジェクトのパッケージ化方法を共有する Python の人気に伴い、Python 開発のメイン ツールとして PyCharm を使用する開発者が増えています。 PyCharm は、開発効率の向上に役立つ多くの便利な機能を提供する強力な統合開発環境です。重要な機能の 1 つはプロジェクトのパッケージ化です。この記事では、PyCharmでプロジェクトをパッケージ化する方法をシンプルかつ分かりやすく紹介し、具体的なコード例を示します。プロジェクトをパッケージ化する理由Pythonで開発

    PowerPoint でアニメーションが機能しない [修正] PowerPoint でアニメーションが機能しない [修正] Feb 19, 2024 am 11:12 AM

    プレゼンテーションを作成しようとしていますが、アニメーションを追加できませんか? Windows PC 上の PowerPoint でアニメーションが機能しない場合は、この記事が役に立ちます。これは多くの人が不満を抱く一般的な問題です。たとえば、Microsoft Teams でのプレゼンテーション中または画面録画中にアニメーションが停止する場合があります。このガイドでは、Windows 上の PowerPoint で動作しないアニメーションを修正するのに役立つさまざまなトラブルシューティング テクニックを説明します。 PowerPoint アニメーションが機能しないのはなぜですか? Windows 上で PowerPoint のアニメーションが機能しない問題を引き起こす可能性のある考えられる理由として、次のようなことが考えられます。

    PyCharm を詳しく見る: プロジェクトを簡単に削除する方法 PyCharm を詳しく見る: プロジェクトを簡単に削除する方法 Feb 26, 2024 pm 04:21 PM

    タイトル: PyCharm の詳細: プロジェクトを削除する効率的な方法 近年、Python は強力で柔軟なプログラミング言語として、ますます多くの開発者に支持されています。 Python プロジェクトの開発では、効率的な統合開発環境を選択することが重要です。 PyCharm は、強力な統合開発環境として、プロジェクト ディレクトリを迅速かつ効率的に削除するなど、多くの便利な機能とツールを Python 開発者に提供します。以下では、PyCharm での削除の使用方法に焦点を当てます。

    PyCharm の実践的なヒント: プロジェクトを実行可能な EXE ファイルに変換する PyCharm の実践的なヒント: プロジェクトを実行可能な EXE ファイルに変換する Feb 23, 2024 am 09:33 AM

    PyCharm は、豊富な開発ツールと環境構成を提供する強力な Python 統合開発環境であり、開発者がコードをより効率的に作成およびデバッグできるようにします。 Python プロジェクト開発に PyCharm を使用するプロセスでは、Python 環境がインストールされていないコンピューター上で実行できるように、プロジェクトを実行可能 EXE ファイルにパッケージ化する必要がある場合があります。この記事では、PyCharm を使用してプロジェクトを実行可能な EXE ファイルに変換する方法と、具体的なコード例を紹介します。頭

    最初に入力してから終了するように ppt アニメーションを設定する方法 最初に入力してから終了するように ppt アニメーションを設定する方法 Mar 20, 2024 am 09:30 AM

    私たちは日々の仕事で ppt をよく使用しますが、ppt のすべての操作機能に精通していますか?例: ppt でアニメーション効果を設定する方法、切り替え効果を設定する方法、各アニメーションの効果時間はどれくらいですか?各スライドは自動的に再生されますか、ppt アニメーションの開始と終了などはできますか? 今回は、まず ppt アニメーションの開始と終了の具体的な手順を共有します。以下にあります。友達、見に来てください。見て! 1. まず、コンピューターで ppt を開き、テキスト ボックスの外側をクリックしてテキスト ボックスを選択します (下図の赤い丸で示されているように)。 2. 次に、メニューバーの[アニメーション]をクリックし、[消去]効果を選択します(図の赤丸部分)。 3. 次に、[

    2年の遅れを経て、国産3Dアニメ映画『エル・ランシェン:深海竜』が7月13日に公開予定 2年の遅れを経て、国産3Dアニメ映画『エル・ランシェン:深海竜』が7月13日に公開予定 Jan 26, 2024 am 09:42 AM

    当サイトは1月26日、国産3Dアニメ映画『エル・ランシェン:深海竜』が最新スチールを公開し、7月13日に公開されると正式に発表したと報じた。 「Er Lang Shen: The Deep Sea Dragon」は、Mihuxing (Beijing) Movie Co., Ltd.、Horgos Zhonghe Qiancheng Film Co., Ltd.、Zhejiang Hengdian Film Co., Ltd.、Zhejiang Gongying Film によって制作されていることがわかります。 Tianhuo Technology Co., Ltd.とHuawen Image (Beijing) Film Co., Ltd.が制作し、Wang Junが監督したこのアニメーション映画は、当初、2022年7月22日に中国本土で公開される予定でした。 。このサイトのあらすじ:授与神の戦いの後、蒋子耶が神々を分割するために「授与神リスト」を持ち出し、授与神リストは天宮によって九州の深海に封印された秘密の領域。実は、授与神リストには神職以外にも強力な悪霊が数多く封印されている。

    See all articles