لا ، إنه ليس روبوتًا؟ ، إنه؟ B Ag O F T Ricks!
️pplease Star لدعم هذا العمل
توفر حقيبة الحيل الامتدادات والدعم حول انتقالات عرض Astro.
يمكن الاطلاع على النشر الحالي لعروض توقيف التكنولوجيا والوثائق على https://events-3bg.pages.dev/
يجلب لك أحدث إصدار من @vtbag/element-strosting ، مع إصلاح الأخطاء للسماح data-* بالتقاطع إلى الصفحة الجديدة!
للحصول على التفاصيل ، راجع changelog من elementcrossing.
غرفة التفتيش DevTools الآن تعمل في مشاريع
pnpm!
صيحة كبيرة و "شكرا لك!" إلى لوكاس لتوفير هذا الإصلاح!
مكون جديد لانتقالات العرض المتقاطع المتقاطع في المتصفح: يمنع مكون
<CamShaft>التأثير الزائفة الناتجة الناتجة عن مجموعات انتقال العرض التي تتجاوز ارتفاع منفذ العرض عند التنقل إلى موضع التمرير العمودي مختلف.
تتيح
<TurnSignal>المتحركة لـ Astro للأمام/للخلف المقدمة عن طريقtransition:animateللعمل مع عرقلة العرض الأصلية@view-transition{}. اختياريًا ، يمكنك تكوين المكون بترتيب إجمالي لصفحات موقعك ، مما يسمح له بالاكتشاف تلقائيًا اتجاه الانتقال.
يعد
<ElementCrossing />مكونًا لأولئك منكم الذين يجربون مع انتقالات عرض CSS فقط المتقاطع ويفقد طريقة للحفاظ على عناصر HTML عبر التنقل: نقل حالة العناصر المحددة إلى الجانب الآخر!
غرفة التفتيش: راجع تحولات العرض الخاصة بك كما لم يحدث من قبل: فحص كل التفاصيل ، والكشف ، والتصحيح ، وتحسين! الآن ، انتقل إلى آثار كل عنصر زائف تم تقديمه بواسطة API Transition View وحتى تبديل الرسوم المتحركة الفردية بشكل انتقائي لفهم ما يحدث بشكل أفضل! استدعاء غرفة التفتيش كمكون (<inspectionchamber />) أو تثبيت الحقيبة كتكامل! والوصول إلى الغرفة من DevToolbar !
دعم ضوء النجوم: هل أردت أي وقت مضى أن ترى شكل موقع Starlight الخاص بك مع تمكين التحولات في العرض؟ اتبع هذه الخطوات للتخلص من أحمال الصفحات الكاملة وجعل موقع STARLIGHT الخاص بك يبدو وكأنه منتجع صحي!
حزمة astro-vtbot ليست مكتبة متجانسة. استخدم المكونات التي تحتاجها ودفع النطاق الترددي فقط لهؤلاء.
| عنصر | وأضاف Brotli بايت |
|---|---|
| نمط الرسوم المتحركة | ~ 0.1k |
| AutoNameselected؟ | ~ 0.3k |
| الحدود؟ | ~ 0.1k |
| الفرامل؟ | ~ 0.2k |
| عمود الحدبات؟ | ~ 0.6k |
| elementCrossing؟ | ~ 1.2k |
| inspectionchamber؟ | ~ 27k |
| لينتر؟ | ~ 1.9k |
| LoadingIndicator ⏳ | ~ 0.4k |
| يتحرك ؟ | ~ 0.2k |
| noscroll | ~ 0.1k |
| pageoffset؟ ⇞ | ~ 0.1k |
| PointerNavigation؟ | ~ 0.1k |
| منفذ ؟ | ~ 0.2k |
| ReplacementSwap ↹ | ~ 0.5k |
| ضوء النجوم ...؟ | ~ 3.0k |
| مقايضات؟ | -0.3k |
| يتأرجح ؟ | ~ 0.1k |
| Turnsignal؟ | ~ 0.5k |
| vtbotdebug؟ | ~ 2.8k |
| تكبير ؟ | ~ 0.1k |
تفضل بزيارة وثائق المكونات القابلة لإعادة الاستخدام للحصول على معلومات مفصلة.
<Linter/> : مكون Linter الذي يساعدك على تحديد المشكلات عند إعداد التحولات.
<VtBotDebug/> : مكون تصحيح الأخطاء يقوم بتسجيل الأحداث وبياناتها عند حدوثها.
<ReplacementSwap/> : تبديل DOM () متغير () ، والذي يحافظ على العناصر في DOM الأصلي لتجنب إعادة تعزيز الرسوم المتحركة IFRAMES أو CSS.
<LoadIndicator> : هل سبق لك أن فاتتك التعليقات المرئية على المواقع مع انتقالات العرض فيما إذا كان التطبيق قد لاحظ النقر؟ تحتاج إلى مؤشر تحميل! ها أنت ذا!
يتيح Zoom ، <Move> و Swing Songations ومكون <AnimationsStyle/> خيارات التصميم الموسعة.
<Portal/> مكون يفرض جميع التحولات من خلال صفحة بوابة/تحميل.
<NoScroll/> حافظ على موضع التمرير العمودي والأفقي الحالي عند الانتقال إلى الصفحة التالية.
تحتوي حقيبة الحيل حاليًا على العديد من العروض التوضيحية التقنية التي تظهر أمثلة على تنفيذ تأثيرات مختلفة باستخدام أحداث الانتقال.
المصادر في هذا المستودع.
أخيرًا وليس آخرًا ، يتضمن النشر أيضًا ▶ jotter ◀ مع مجموعة من المعلومات حول أحداث الانتقال بالإضافة إلى معلومات أساسية ونصائح وحيل قيمة على عرض التحولات في Astro.
بعض المحتويات عبارة عن عروض تجريبية تقنية ، وبعضها أدوات مفيدة ، وبعضها مكونات قابلة لإعادة الاستخدام التي يمكنك استخدامها في مشروعك للتعامل مع حالات الحافة التي تتجاوز ميزات Astro القياسية.
للحصول على المساعدة ، تحقق من علامة التبويب Discussions على Github Repo.
يتم الحفاظ على هذه الحزمة بواسطة MartRapp بشكل مستقل عن Astro. اهلا وسهلا بكم للمساهمة من خلال تقديم مشكلة أو فتح العلاقات العامة!
انظر changelog.md للحصول على تاريخ من التغييرات على هذه الحزمة.