問題タブ [cross-fade]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
2662 参照

jquery - fadeIn() を使用して背景画像を切り替える

私はいくつかの視差画像を使用してレスポンシブ Web サイトを作成しています。最初の画像は、画像スライダーのような循環画像を意図しています。応答性のためにjquery Coolkittenを使用しています。

私がロードした関連するjqueryプラグインは次のとおりです。

div の css は次のとおりです。

このレイアウトで背景に HTML 画像を使用すると問題が発生する可能性があることがわかりました。そのため、配列を使用してそれを回避しています。

$(document).ready()CSSの背景を配列に変更してから配列を循環する関数にラップされたコードがありfadeIn()、スムーズな移行のために追加しました:

イメージ サイクルは正常に動作していますが、何らかの理由でfadeIn()動作していません。1 つのイメージから別のイメージに点滅するだけです。誰かが私に欠けているものを教えてもらえますか?

0 投票する
1 に答える
162 参照

animation - クロス フェード遅延トランジション終了イベントにアクセスできません

ヒーロー トランジションをうまく操作するために、ポリマー アプリでクロス フェード遅延トランジションを使用しています。ヒーロー トランジションが終了した後にテキストをクロス フェードします。

現在、transition-end コールバックを使用して別の操作 (JavaScript 関数呼び出し) をトリガーしています。問題は、この呼び出しはリソースが少し高価であるため、クロスフェード遅延遷移が遅れることです。

transition-end コールバックは、ヒーローの遷移が完了した後にトリガーされます。クロスフェード遅延がいつ終了したかを知るために、同様のイベントはありますか?

最高、ニコラス

0 投票する
1 に答える
1769 参照

bash - sox を使用した複数のオーディオ ファイルのクロス フェード

複数のオーディオ ファイルを 3 秒間のクロスフェードでクロスフェードし、それらを sox で 1 つのファイルに結合しようとしています。

以下のコマンドで複数のファイルを結合できますが、各ファイル間でクロス フェードする方法がわかりません。

以下のコマンドを使用して 2 つのファイルをクロス フェードできますが、複数のファイルを結合する最初の行と、接合/クロス フェードする 2 番目の行を結合する方法がわかりません。

この質問を見つけましたが、答えがうまくいきません。 sox スプライスによるオーディオ ファイルのグループのクロスフェード

0 投票する
2 に答える
11444 参照

image - ffmpeg は、一連の画像をビデオに変換します - クロスフェードまたは 2 フレームごとのその他のトランジションを使用

現在、一連の画像をビデオに変換できますが、それらの間にトランジション/アニメーションを追加する必要もあります。

上記のコマンドは、画像シリーズからビデオを作成するために機能しています

しかし

ここで、各フレームの前に最終的なビデオに表示されるフェードまたはその他のトランジション/アニメーションを追加したいと思います

私はたくさんグーグルで検索しましたが、この問題の解決策はまだ見つかりませんでした.

道を教えてください。

前もって感謝します。

0 投票する
1 に答える
696 参照

css - タイマー付きクロスフェードと組み合わせたホバー時の CSS スケーリング画像

ホバー時に画像をスケーリングする方法は次のとおりです。

2つの画像をクロスフェードする方法は次のとおりです。

https://jsfiddle.net/1n279ct8/

そして、2つを組み合わせようとすると、次のようになります。

https://jsfiddle.net/h453xaav/

痛い!「トップ」レイヤーのみをホバー可能として扱っています。

この動作は私にはまったく理にかなっていますが、イライラすることに、エレガントな回避策がわかりません。

純粋な CSS でそれは可能ですか、それとも JavaScript を分解する時が来ましたか?

前もって感謝します :-)

PS コードはできるだけシンプルにしています。私の実際の作業では、id とクラスを使用し、さまざまなブラウザーのケースを実行しますが、ここでは、私の意図をできるだけ明確に伝えるために、その一部を省略しています。これは私の最初の投稿なので、家のスタイルがよくわかりません。メッセージを伝えるために、それを「完全」にするか、単に「概念実証」にするかを教えてください:-)

PPS これら 2 つの効果の CSS の使用方法が既に間違っているか、「危険」である場合は、お知らせください。

0 投票する
1 に答える
30 参照

jquery - 画像を使用しないクロスフェード トランジション効果

私が取り組んでいるプロジェクトの証言セクションを作成しようとしています。理想的には、各証言がフェードアウトしてから、次の証言がフェードインするようにしたいと考えています。残念ながら、少しグーグルした後、画像を次の画像に移行するだけの例やチュートリアルを見つけることができません。

コード スニペット、プラグイン、チュートリアルへのリンク、またはこれを完了する方法に関する純粋なアドバイスをいただければ幸いです。

0 投票する
2 に答える
2917 参照

linux - FFmpeg オーディオ クロスフェード

ffmpeg を使用して複数のビデオをマージし、その間にクロスフェード トランジションを適用しようとしています。これを参考にビデオのクロスフェードが動くようになりました。同時に、各ビデオに関連付けられた元のオーディオにクロスフェードを適用するために、オーディオも必要です。色々と参考にさせて頂きましたが、

バッファ キュー オーバーフロー、ドロップ。

これこれこれは私が参照したものはほとんどありません。私はこれこれconcatの解決策を得て、オーディオの長さがビデオよりも長いオプションを使用して出力を生成しました。ビデオで使用されている正確なfade値を使用しましたが、ビデオのように機能していません。以下は、私がテストしているffmpegコマンドです。

また、asetptsビデオと同じものを使用すると、上記と同じ問題が発生します。ここで何が間違っていますか? ビデオとオーディオの両方をクロスフェードさせるために使用できる他の方法はありますか?

0 投票する
1 に答える
353 参照

jquery - ホバー時に jQuery を使用して画像とテキストをクロスフェードする

OKだから、ホバー時に別の画像にクロスフェードする画像があります。また、2 番目の画像に対応する別のテキストにクロスフェードする説明テキストもあります。私が今持っているもの、ちょっと悪い、私が持っている唯一の問題は、それが空白にフェードすることです(CSS: Display-none - 2番目の画像が最初の画像の横にポップアップしないように追加されました...私はポジションをいじってみましたが、今のところサイコロはありません)

また、その周りに関数をトリガーするスポットがあるようです(ポインターを動かします)...まるである種のラッピングが起こっているようですか?

全体として、(fadeIn/fadeOut とは対照的に) 表示と非表示の機能を試してみましたが、問題はありませんでした...しかし、望ましい効果は得られませんでした。