بدأنا في مقالات سابقة استعراض لمجموعة جديدة من الاكواد التي تضيف تنسيقات متنوعة على التصميم ، مثل مؤشر التحميل وكيف يمكن وضع عدد من الاكواد تضيف مؤثرات حركية جديدة له.
واليوم سنتناول عدد من الافكار المميزة في التحكم النقطي او كما يعرف ساريكم بعض تنسيقات التحكم النقطي المميزة (DOT NAVIGATION STYLES) .
مثال حي التحميل
عناصر القائمة الصغيرة عادة لا نعطيها اي اهتمام في التصميم الابداعي . فإنها غالبا ما تكون مهملة بسبب حجمها ولكن لدينا الفرصة لجعلها أفضل باضافة تأثيرات جديدة ومنوعة . اليوم نريد أن نعرض مجموعة ملهمة من تنسيقات التحكم النقطي (DOT NAVIGATION STYLES) مع تاثيرات رقيقة عندنا نمر بمؤشر الماوس أو نضغط عليها .وبالنسبة للتأثيرات نحن إستخدمنا تأثيرات متعددة مثل التحولات(transitions ) في التأثير , perspective , SVG
ملاحظة :
بنية الكود:
<div class="dotstyle dotstyle-fillup"> <ul> <li class="current"><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Products</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Contact</a></li> </ul> </div>See the Pen bEcBx by mohamed maher (@fwasl) on CodePen. 4025
وفي النهاية اامل أن تستمتع بهذه التنسيقات والتأثيرات وتجدهم ملهمين لك.
