رفتن به مطلب

درخواست افزونه


پست های پیشنهاد شده

سلام دوستان

من یه افزونه میخواستم شبیه تصویر نارنجی که بالای سایت زیر اویزان هست و حرکت میکنه

http://utabweb.net/

میخوام بدونم چطوری درست شده کد هست یا افزونه یا چیز دیگه ای؟

لطفا راهنمایی بفرمایید ممنون

لینک به ارسال

درود

این کار با سی اس اس انجام شده سورس کد سایت رو بررسی کنید خواهید دید

لینک به ارسال
در 9 دقیقه قبل، sado1214 گفته است :

یعی کد تچ تی ام الش رو پیدا میکنم تو سورس کد اما سی اس اسش رو نمیتونم پیدا کنم

 

.tekan:before {
    content: '';
    position: absolute;
    top: 90px;
    left: 82px;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    -webkit-box-shadow: 0px -81px 0px -2px #1D1D1D, 0px -81px;
    -moz-box-shadow: 0px -81px 0px -2px #1D1D1D, 0px -81px;
    -o-box-shadow: 0px -81px 0px -2px #1D1D1D, 0px -81px;
    box-shadow: 0px -81px 0px -2px #1D1D1D, 0px -81px;
}

.tekan {
       position: absolute;
    top: 179px;
    right: -71px;
    width: 180px;
    height: 150px;
    background: #F95804;
    border-radius: 100%;
    color: #FFF;
    padding-top: 30px;
    line-height: 32px;
    text-align: center;
    font-size: 29px;
    text-transform: uppercase;
    -webkit-animation: 3s ease-in-out 0s normal none infinite running swing;
    -moz-animation: 3s ease-in-out 0s normal none infinite running swing;
    -o-animation: 3s ease-in-out 0s normal none infinite running swing;
    animation: 3s ease-in-out 0s normal none infinite running swing;
    -webkit-transform-origin: 100px -121px;
    -moz-transform-origin: 100px -121px;
    -o-transform-origin: 100px -121px;
    transform-origin: 100px -121px;
}

    .tekan:after {
        content: '';
        position: absolute;
        top: -85px;
        left: 90px;
        width: 2px;
        height: 100px;
        border-radius: 0%;
        background: #1D1D1D;
    }

 

لینک به ارسال

به این کد ها هم نیاز پیدا میکنید

 

@-webkit-keyframes swing {
    0% {
        -webkit-transform: rotate(5deg);
    }

    50% {
        -webkit-transform: rotate(-5deg);
    }

    100% {
        -webkit-transform: rotate(5deg);
    }
}

@-moz-keyframes swing {
    0% {
        /*! -moz-transform: rotate(5deg); */
    }

    50% {
        /*! -moz-transform: rotate(-5deg); */
    }

    100% {
        /*! -moz-transform: rotate(5deg); */
    }
}



@keyframes swing {
    0% {
        /*! transform: rotate(5deg); */
    }

    50% {
        /*! transform: rotate(-5deg); */
    }

    100% {
        /*! transform: rotate(5deg); */
    }
}


@-o-keyframes swing {
    0%;

{
    -o-transform: rotate(5deg);
}

50% {
    -o-transform: rotate(-5deg);
}

100% {
    -o-transform: rotate(5deg);
}

}

.nerkh_daier {
    color: #000;
}

برای یادگیری بهتر خودتون امتحان کنید و تغییر بدید

لینک به ارسال

سلام مجدد

همه چیزاش رو چک کردم درست شد ولی حرکتش درست نمیشه با اینکه کدهاش هم هست 

نمیدونم چرا. 

حتی یه سری کد سی اس اس دیگه هم باید اضافه میکردم اونارو هم گذاشتم ولی درست نمیشه 

ویرایش شده توسط sado1214
لینک به ارسال
در 21 ساعت قبل، sado1214 گفته است :

سلام مجدد

همه چیزاش رو چک کردم درست شد ولی حرکتش درست نمیشه با اینکه کدهاش هم هست 

نمیدونم چرا. 

حتی یه سری کد سی اس اس دیگه هم باید اضافه میکردم اونارو هم گذاشتم ولی درست نمیشه 

نیاز به سی اس اس دیگری نیست براتون اماده کردم دانلود کنید

tekan.zip

لینک به ارسال

ممنون 

فهمیدم اشکال کار من کجا بود . تگ a رو که قبلا از این کد نوشته شده و باعث میشه این شکل لینک دار بشه رو من استفاده کردم و کدهای سی اس اس مربوط به اون رو که تو کدهای سی اس  اس میزارم حرکت نمیکنه. در واقع کدهای سی اس اسی هم که گفتم اضافه کردم همین ها بود . حالا چرا این مشکل وجود داره نمیدونم

 

این کد اچ تی ام ال: 

<a href="/" title="???? ??? ?????" class="logo"><span class="uta1">?????</span><span class="uta2"> ?? </span><img alt="???? ??? ?????" title="???? ??? ?????" src="/template/img/img-template/logooo/logo_utabweb.png" class="img_logo" />
 

و این هم کدهای سی اس اس :

 

.box_menu {
    width: 100%;
    height: 60px;
    float: right;
    background: #000;
    margin: 20px 0px;
    position: relative;
    box-shadow: 0px -2px 25px #8A8988;
}
    
    .img_logo {
    margin-top: 3%;
    float: right;
    margin-right: 3%;
}
    
    .uta1 {
    color: #D44408
}

.uta2 {
    color: #08D9CE;
}

 

یه اشکالی هم که هست اینه که با اینکه تو اچ تی ام ای utf-8 تعریف کردم اما بازم فارسی رو با علامت سوال نشون میشده.

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...