CSS3 تصميم المواد قائمة زر قابلة للتوسيع تصميم المواد
هذا هو نمط تصميم المواد بارد تأثير زر القائمة المفتوحة. هناك سبعة تأثيرات مختلفة في هذا التأثير الخاص. في كل تأثير ، يمكن فتح مجموعة من أزرار القائمة الرئيسية عن طريق النقر فوق زر القائمة الرئيسية. تختلف تأثيرات الرسوم المتحركة لمختلف القوائم الفرعية الافتتاحية. التأثير الأول هو أنه عند النقر فوق زر القائمة الرئيسية ، سينتقل زر القائمة الرئيسية إلى اليسار ، وسيظهر زر القائمة الرئيسية بدوره مع تحريك زر القائمة الرئيسية. التأثير الثاني هو أنه بعد النقر فوق زر القائمة الرئيسية ، ستظهر طبقة قناع دائرية ، وستظهر أزرار القائمة الفرعية الأربعة في المواضع العلوية والسفلية واليسرى واليمنى لطبقة القناع الدائري. التأثير الثالث هو أنه بعد النقر فوق زر القائمة الرئيسية ، سيظهر زر القائمة الفرعية أعلى زر القائمة الرئيسية من أسفل إلى أعلى. التأثير الرابع هو أنه بعد النقر فوق زر القائمة الرئيسية ، سينزلق زر القائمة الفرعية على جانبي زر القائمة الرئيسية. التأثير الخامس هو أنه بعد النقر فوق زر القائمة الرئيسية ، سيظهر زر القائمة الفرعية من موضع زر القائمة الرئيسية ويظهر بدوره. التأثير السادس هو أنه بعد النقر فوق زر القائمة الرئيسية ، تظهر أزرار القائمة الفرعية على جانبي زر القائمة الرئيسية ، ثم تدور 360 درجة حول زر القائمة الرئيسية. التأثير السابع هو النقر فوق زر القائمة الرئيسية ، تظهر أربعة أزرار قائمة فرعية بدورها ، حول زر القائمة الرئيسية