25
تشکر

چرخش عناصر به وسیله CSS

چرخش عناصر به وسیله CSS

چرخش عناصر به وسیله CSS

 


با سلام خدمت تمامی کاربران سایت آپارنت ، با عرض پوزش از تمامی کاربران و مدیر سایت آپارنت دوست خوبم آقای شفیعی ، به دلیل مشغله های کاری و درسی چند مدتی خدمت شما عزیزان نبودم ، امیدوارم این تاخیر فعالیت رو به بزرگی خودتون ببخشید .

امروز تو این پست قصد داریم آموزش چرخش عناصر به وسیله CSS رو به شما دوستان آموزش بدیم طوری که در مرورگر های به روز به راحتی عنصر مورد نظر چرخیده و هیچ مشکلی نداشته باشد ، بنده در پروژه ای با مشکل مرورگر و چرخش یک المنت روبرو شدم ، هدف از چرخش به این صورت بود که وقتی Pointer کاربر به روی المنت مربوطه رفت المنت شروع به چرخش کند. این فرآیند در مرورگر Google Chrome و با اضافه کردن پیشوند -webkit- به راحتی انجام میشد ولی در مرورگر Mozila FireFox حتی با اضافه کردن پیشوند -moz- هم قادر به انجام فرآیند نبود ، با توجه به ساعت ها گشت و گذار در اینترنت و سایت های مربوطه و مرتبط با این موضوع به تکه کدی دسترسی پیدا کردم که این مشکل رو به راحتی حل کرده بود و با توجه به سختی هایی که بنده برای دسترسی به این کد کشیدم لازم دونستم تا دسترسی شما به این کد رو راحت تر کنم به همین دلیل امروز این کد رو با هدف سهولت کاری شما در سایت منتشر میکنم و امیدوارم بتونم قسمتی از مشکلات شما عزیزان رو حل کنم .

 

کد CSS :

.rotate
{
transition-property: transform;
transition-duration: 1s;
-moz-transition-property: -moz-transform;
-moz-transition-duration: 1s;
-webkit-transition-property: -webkit-transform;
-webkit-transition-duration: 1s;
-o-transition-property: -o-transform;
-o-transition-duration: 1s;
}

 

.rotate:hover
{
-moz-transform: scale(1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-webkit-transform: scale(1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-o-transform: scale(1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-ms-transform: scale(1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
transform: scale(1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
}

 

موفق باشید .

جاوید خانلو

جاوید محمدخانلو هستم دانشجوی کارشناسی رشته نرم افزار ، در حال حاظر تو قزوین زندگی میکنم و تو زمینه های PHP,HTML,CSS,JQUERY,AJAX,,MYSQL,WordPress,C++,C,VB,NETWORK, فعالیت میکنم.

  • احسان می‌گه:

    تست

  • احسان می‌گه:

    سلام

    دمت گرم داداش

  • حسین کربلایی می‌گه:

    سلام دستت درد نکنه آقایی.

  • Arian Tashakkor می‌گه:

    با سلام و درود فراوان
    بسیار عالی بود جاوید عزیز. امیدوارم در امتحانات هم موققیت کامل رو بدست بیارید.

    با آروزی بهترین ها
    موفق و سربلند باشید !


  • نظرات این مطلب بسته است.