انیمیشن منو دیجی کالا

[mo7300]

سلام
کسی کد این انیمیشن جدید دیجی کالا رو داره
این که روی منو میری یه سایه از وسط باز میشه

[marasiali]

سلام
واضحتر توضیح بدین کجای سایت؟چه افکتی؟

[mo7300]

وقتی منو hover میشه سایه میاد رو متن که از وسط باز میشه
148638

[anvar]

کار خاصی نداره

فرض می کنیم شما یک لیست ul با چندین li دارید.
خاصیت position هر کدام از این لیست ایتم ها باید relative باشه

li
{
position: relative;
}

با استفاده از شبه عنصر before برای هر کدام از لیست آیتم ها یک نوار در قسمت پائین تعریف می کنیم که اندازه آن 0 هست

li:before
{
content: '';
height: 1px;
width: 100%;
background-color: #cc3333;
position: absolute;
bottom: 0px;
right: 0px;
box-shadow: 0 2px 10px 0 rgba(0,0,0,.15);
transition: all .3s ease-in-out;
transform: scaleX(0);
}

حالا می خواهیم هر زمان موس بر روی لیست ایتم hover شد اندازه این نوار 100 درصد مقدار تعریف شده بشه یعنی

li:hover:before
{
transform: scaleX(1);
}

والسلام

[mo7300]

دستت درد نکنه
ولی اونجوری که من برررسی کردم یه li قبل همه هست که با jquery جابجا میشه شما اگه hover میکنی از نقطه قبلی میاد به اونجا اگه بتونین کد jquery رو هم بزارین خوب میشد

[anvar]

یک مثال براتون آماده کردم البته از روش دیجی کالا نرفتم اما نتیجه مشابه با همونه

http://s9.picofile.com/file/8333381434/menu.rar.html