css-transforms

0熱

1答えて

私は、いくつかの要素をアニメーション化（pngまたはjpgs）する必要のあるサイトを持っていて、jqueryアニメーションやCSS変換/トランジションを使って作業していますが、 gifを使用するとパフォーマンスが向上します。これらの方法の1つを他の方法よりも使用する利点はありますか？

0熱

1答えて

divを変換するCSS/SCSSレール、ネストされていない画像（レール）

divの上にマウスを置くと、添付画像のスケールが2秒以上になるメインのdiv内に画像を設定しようとしています。 div自体（境界線）のみが拡大され、添付された画像自体は拡大されません。画像の縮尺を変えようとすると、この執筆時点では何の処置もありません。これはRails 5.1.2で行われています。私は何が欠けていますか？ビュー/コミュニティ/ index.html.erb： <div class

0熱

1答えて

CSS3片側ボーダーカット/変形/スキュー

こんにちは、私はここに添付された画像のようなステップメニューをスタイライズしたいです。どのように私はこれを形式化することができますか？主な問題は、メニューの右側にある境界です。は私も三角形の境界効果を持つ別のスタイルを作ってきた、私のJSFiddleのURL https://jsfiddle.net/hcx1pv8x/を確認してください。このための私のHTMLコンテンツは、次のとおりです。 <

0熱

1答えて

css3変換：translatex（-100％）; IE11およびEdgeで正しく動作しません。

コンテナtransform: translatex(-100%);は、Internet Explorer 11およびEdgeでtransform: translatex(0);に移動しても正しく動作しません。コンテンツは移動しますが、マウスをタッチすると元に戻ります。 .widget { position: fixed; top: 0; bottom: 0;

2熱

2答えて

CSSアニメーション/エッジ

どのようにすることができますIE /エッジでこの事の仕事？なぜ私は理解していない。 iは、その境界が破線回転開始となる要素にクラスを追加します。 $("#btn").click(function() { $(".bg")[0].classList.toggle("rotate"); }) @keyframes PDFgenerating { to {

2熱

2答えて

回転した要素を右端に配置する方法

絶対要素（この場合はイメージ）をコンテナの右端に揃えようとしています。要素が回転していないが、変換が含まれている場合は、leftプロパティが正しく計算されません。多分私は何かが不足しているかもしれませんが、私が今使っている解決策は、幅を取得してからコンテナの幅から引き算するのにgetBoundingClientRect()です。ここには私がやっていることを示すJSFiddleがあります。

2熱

1答えて

変換でのHTMLテキスト整列の問題

変換されたテキストの行をhtml/cssでレンダリングしようとしていますが、いくつか問題があります。私がY方向にスケールすると、要素の全体的な配置がこの図のようにシフトします。同じエラーでL 180度の結果をわずかに回転しようと。テキストのyスケーリング軸の垂直方向の配置を維持するにはどうすればよいですか？私も小さな帽子でこれを行うとしましょう、あなたのソリューションの変更？ここで何が問題にな

0熱

2答えて

CSSトランジション：チェーントランスフォームが同時に開始

cssトランジション/トランスフォームを使用してアニメーションでハンバーガーボタンを作成しようとしています。私は第1および第3のスパンの翻訳が完了した後にのみローテーションを開始したい（それらは中間スパンと重なる必要がある）。したがって、私はそうのようにCSSで連鎖した変換入れる： transform: translate(0, -28px) rotate(-45deg); をそれが働いて、回

0熱

1答えて

SVG親はアニメーションを出力しますが、子SVGは表示しません

親SVGはなぜ回転しますが、子SVGは回転しませんか？最初のSVGの親要素が第二SVG ChromeとIE 11にしようとしましたの子要素アニメーションではなくなります注（はい、.parent-svg-1はIE 11に回転）、両方のブラウザでは同じ結果が得られました。 FireFoxでも試しました。.child-svg-2は回転しますが、中心からは回転しません。 SVG 1.1では $(doc