محمود عبدالنبي
تحسين التحويل · أداة سطر أوامر · 2

دليل المستودع: معيار تحويل زر CTA ثابت أسفل شاشة الجوال

صفحة تعريفية مستقلة بمستودع معيار تحويل زر CTA ثابت أسفل شاشة الجوال. توضّح ما الذي يحاول حله، ولمن يناسب، وما الملفات التي ستجدها قبل الانتقال إلى المصدر.

المشكلة التي يعالجها

يوضح التوثيق الأصلي نطاق المشكلة بهذا الوصف:

Develop a high-performance mobile sticky CTA component (sticky_cta.js): 1) Uses modern IntersectionObserver (0 scroll event listeners) for 60fps performance and zero INP penalty, 2) Automatically detects when native CTA is visible and hides smoothly, 3) Supports bilingual RTL/LTR layouts with countdown timer and price display, 4) Complete HTML demo and performance test suite.

لمن صُمم؟

الجمهور المحدد في README: BOTH operating in high-growth e-commerce, digital publishing, and direct-response marketing across Saudi Arabia, UAE, and Egypt.

محتويات المستودع

الملفات الأساسية التي يسردها قسم بنية المستودع في README:

  • css/sticky_cta.css
  • demo/index.html
  • docs/performance-benchmark-inp.md
  • docs/sticky-cta-ab-test-results.md
  • examples/demo_storefront.html
  • LICENSE
  • README.md
  • src/sticky_cta.css
  • src/sticky_cta.js
  • src/sticky_cta_logic.js
  • tests/component.test.js
  • tests/test_sticky_cta.py

طريقة مراجعته واستخدامه

  1. ابدأ بقراءة README وتأكد أن المشكلة المذكورة تطابق احتياجك الفعلي.
  2. افحص الملفات المذكورة أعلاه؛ أسماء الملفات توضح مكان البيانات والأدوات والقوالب والاختبارات.
  3. اتبع Quick Start الموجود في README، وتحقق من المتطلبات قبل تشغيل أي أمر.
  4. قارن المخرجات بعينة موثقة، وراجع القيود قبل استخدامها في قرار أو عمل عميل.

أمثلة أوامر البدء من README: python -m unittest discover -s tests · node --test tests/*.test.js

النطاق والقيود

  • iOS Safe Area Inset Accommodation: Persistent bottom CTAs must include 'padding-bottom: env(safe-area-inset-bottom)' to prevent overlap with native iOS home indicators.
  • Screen Real Estate Budget: Fixed bottom bar height should be tested at the actual viewport and text scale so it does not obscure essential content.
  • Scroll-Directional Visibility: Bar reveals on subtle scroll-up or maintains persistent presence with smooth opacity transition.

هذه الصفحة تلخص التوثيق المتاح ولا تثبت أداءً أو نتيجة تجارية. تحقق من صلاحية البيانات والمتطلبات قبل الاستخدام.

مستودعات مرتبطة