پارس وردپرس

تماس با پشتیبانی

0969 704 0911

6018 822 0935

parswp@yahoo.com

صفحه نخست
قوانین
تعرفه تبلیغات
پرداخت آنلاین
درباره ما
تماس با ما
    • سبد خریدتان خالی است.
  • سبد خرید

    محصولات انتخاب شده : 0

    قیمت کل : 0 ریال

    منوی اصلی

    کد امنیتی : 5 + 2

    گروه طراحی پارس وردپرس در سال 1390 فعالیت خود را در زمینه طراحی وبسایت های تفریحی ، خبری و … با استفاده از وردپرس آغاز نمود .

    مشتری محور بودن یکی از اساسی ترین اصول در نظر گروه طراحی پارس وردپرس می باشد . گروه طراحی پارس وردپرس متشکل از حرفه ای ترین افراد در زمینه های برنامه نویسی تحت وب ، تحلیل پروژه ، گرافیک و … است که همواره در تمامی مراحل پروژه در کنار شما خواهند بود .

    طراحی فیدخوان و سایت های خبری تحت وب یکی از خدمات اصلی گروه است که با جدیدترین متدها و تکنولوژی های برنامه نویسی صورت می پذیرد . مهمترین ویژگی قالب‌های جدید پارس وردپرس استاندارد سازی و بهینه سازی قالب برای جستجو در وب می باشد که در نتیجه آن موتورهای جستجو قادر خواهند بود محتوا و کلمات کلیدی را راحت تر از گذشته پیدا کنند و این امر صد در صد باعث پیشرفت سایت شما در سایتهایی مانند گوگل خواهد شد.این تیم مفتخر است که تکنولوژی جدید سئو (seo) را به کاربران خود در جهت ارتقاء ، با بهترین حالت ممکن برای بهینه سازی وب سایت بر پایه وردپرس هدیه کند.

  • E-Mail : parswp @ yahoo.com
  • Tel : 0911 - 704 - 0969 | 0935 - 822 - 6018
  •    تبلیغ اسلایدشو 240*848 - هزینه ماهانه 50,000 تومان (نمایش در صفحه نخست)
  •    تبلیغ بنری 240*120 - هزینه ماهانه 30,000 تومان (نمایش در تمام صفحات)
  •    تبلیغ بنری 60*468 - هزینه ماهانه 40,000 تومان (نمایش در تمام صفحات)
  •    تبلیغ بنری 60*468 - هزینه ماهانه 30,000 تومان (نمایش در تمام پیش نمایش ها)
  •    تبلیغ متنی - هزینه ماهانه 15,000 تومان (نمایش در تمام صفحات)
  • کد امنیتی : 5 + 2

    آموزش ایجاد افکت چرخش تصویر هنگام رفتن ماوس روی آن

  • دسته بندی ها : آموزش
  • ۵ فروردین ۱۳۹۵
  • 625 بازدید
  • effects-image-rotation-parswp

    آموزش ایجاد افکت چرخش تصویر

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

    حتما بخوانید : انتقال وردپرس از لوکال هاست به هاست

    ساختار HTML
    ساختار HTML ای که در اینجا مورد استفاده قرار داده ایم، بسیار ساده است. به کد زیر دقت کنید :

    <p class="parswp-rotate">
    	<a href="http://parswp.ir/">
    		<img border="0" src="image.png" />
    	</a>
    </p>

    همانطور که مشاهده می کنید یک در برگیرنده (در اینجا تگ p) داریم که کلاس parswp-rotate به آن نسبت داده شد است. شما می توانید در اینجا بجای تگ p از div یا هر تگ دیگری که مد نظر شماست استفاده کنید. درون این تگ، یک لینک و درون لینک نیز یک تصویر قرار داده ایم. بدیهی است که قرار دادن تگ a الزامی نیست و تصویر شما می تواند فاقد لینک باشد. بنابراین بر اساس توضیحات ارائه شده، می توانید کد بالا را به دلخواه خود تغییر دهید. تنها بخش حائز اهمیت این است که تصویر مورد نظر شما درون یک در بر گیرنده با کلاس parswp-rotate قرار گرفته باشد تا CSS ای که در ادامه درج می شود به درستی برای شما کار کند. کد های CSS را جهت سادگی کار شما به سه بخش تقسیم کرده ایم که به دلخواه خود می توانید از کدی که با نیاز شما سازگار تر باشد استفاده کنید.

    حتما بخوانید : رفع مشکل قرار دادن رمز بر روی wp-admin

    چرخش ۳۶۰ درجه تصویر به همراه بازگشت
    در مرحله ی اول می خواهیم کاری کنیم که تصویر انتخابی ما، ۳۶۰ درجه چرخیده و سپس به آرامی به جای اول خودش باز گردد. برای این کار از استایل های زیر استفاده میکنیم :

    .parswp-rotate img {
    	-moz-transition: all 0.8s ease-in-out;
    	-webkit-transition: all 0.8s ease-in-out;
    	-o-transition: all 0.8s ease-in-out;
    	-ms-transition: all 0.8s ease-in-out;
    	transition: all 0.8s ease-in-out;
    }
    
    .parswp-rotate img:hover {
    	-moz-transform: rotate(360deg);
    	-webkit-transform: rotate(360deg);
    	-o-transform: rotate(360deg);
    	-ms-transform: rotate(360deg);
    	transform: rotate(360deg);
    }

    همانطور که در بالا به آن اشاره شد، با استفاده از استایل های بالا، هر گاه ماوس بر روی تصویر مورد نظر قرار بگیرد، تصویر ۳۶۰ درجه چرخیده و در صورت خارج شدن ماوس از روی آن، تصویر مجددا با چرخش برعکس به حالت اولیه باز می گردد.

    چرخش ۶۰ درجه تصویر به همراه بازگشت
    خوب، حالا شاید مایل نباشید تصویر را یک دور کامل بچرخانید و تنها مایل باشید تصویر اندکی به سمت مورد نظر بچرخد. مثلا با استفاده از کد های زیر تصمیم داریم تصویر را تنها ۶۰ درجه چرخانده و در صورت خروج ماوس به حالت اولیه بازگردانیم :

    .parswp-rotate img {
    	-moz-transition: all 0.2s ease-in-out;
    	-webkit-transition: all 0.2s ease-in-out;
    	-o-transition: all 0.2s ease-in-out;
    	-ms-transition: all 0.2s ease-in-out;
    	transition: all 0.2s ease-in-out;
    }
    
    .parswp-rotate img:hover {
    	-moz-transform: rotate(60deg);
    	-webkit-transform: rotate(60deg);
    	-o-transform: rotate(60deg);
    	-ms-transform: rotate(60deg);
    	transform: rotate(60deg);
    }

    بدیهی است که شما می توانید هر درجه ای که مایل هستید را بجای عدد ۶۰ قرار دهید تا تصویر دقیقا به همان مقدار به جهت مورد نظر شما مایل شود. توجه داشته باشید که درجه در ۵ خط متفاوت تعریف شده، بنابراین برای رسیدن به نتیجه ی مناسب باید درجه را در هر ۵ جا تغییر دهید.

    حتما بخوانید : پشتیبانی از ویژگی Instant Article در وردپرس

    چرخش ۳۶۰ درجه بدون بازگشت
    در هر دو حالت قبلی، تصویر پس از چرخش، در صورتی که ماوس از روی آن برداشته می شد به حالت اولیه باز می گشت. حالا می خواهیم فرض کنیم که شاید مایل باشید تصویر پس از خارج شدن ماوس از روی آن، دیگر حرکت نکند. یعنی در صورت قرار گیری ماوس روی تصویر، چرخش انجام می شود ولی پس از برداشتن ماوس از روی تصویر، دیگر اتفاقی نخواهد افتاد. در این حالت از استایل زیر استفاده میکنیم :

    .parswp-rotate img:hover{ 
    	-moz-transition: all 0.5s ease-in-out;
    	-webkit-transition: all 0.5s ease-in-out;
    	-o-transition: all 0.5s ease-in-out;
    	-ms-transition: all 0.5s ease-in-out;
    	transition: all 0.5s ease-in-out;
    	-moz-transform: rotate(360deg);
    	-webkit-transform: rotate(360deg);
    	-o-transform: rotate(360deg);
    	-ms-transform: rotate(360deg);
    	transform: rotate(360deg);
    }

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

    توجه !!! فکر می کنیم نیازی به گفتن این مسئله نباشد که با منفی کردن درجه ها، می توانید حرکت هایی برعکس آنچه در بالا به آنها اشاره شد ایجاد کنید.

    منبع : پارس وردپرس

    , , , , , , , , , , , , , , , , ,
    آموزش ایجاد افکت
    آموزش ایجاد افکت چرخش تصویر
    آموزش طراحی
    آموزش وردپرس
    افکت چرخش
    افکت چرخش تصویر
    چرخش تصویر
    طراحی سایت
    طراحی سایت ارزان
    طراحی سایت حرفه ای
    طراحی سایت وردپرسی
    طراحی وب سایت
    طراحی وب‌سایت
    قالب تفریحی
    قالب خبری
    قالب وردپرس
    ماوس روی آن
    وردپرس

    راستی! ما یک راه نزدیک برای درکنار شما بودن پیدا کردیم :)

    کانال تلگرام پارس وردپرس

    به دلیل مسدود شدن درگاه های پرداخت اینترنتی اگر در واریز آنلاین مشکلی داشتید می توانید از شماره کارت زیر اقدام نمائید .

    شماره کارت : 2154-6486-3378-6104

    بانک ملت

    بنام : سینا شاهین

    شماره همراه 09358226018 ، 24 ساعته پشتیبان شما می باشد و پس از واریز برایتان ارسال خواهد شد .

    مطالب تصادفی
    آموزش ساخت نقشه سایت با Slick Sitemap
  • بازدید : 1096
  • تاریخ : ۲۳ - ۰۱ - ۱۳۹۵
  • غیر فعال کردن هشدار دیدگاه جدید در وردپرس
  • بازدید : 559
  • تاریخ : ۱۱ - ۰۹ - ۱۳۹۴
  • آموزش پسورد گذاری wp-admin در Cpanel و Direct Admin
  • بازدید : 1132
  • تاریخ : ۲۰ - ۰۸ - ۱۳۹۴
  • نمایش برچسب ها در منوی بازشونده
  • بازدید : 928
  • تاریخ : ۲۲ - ۱۱ - ۱۳۹۴
  • حمله گسترده به بیش از ۶۰ هزار سایت وردپرس
  • بازدید : 806
  • تاریخ : ۲۲ - ۱۱ - ۱۳۹۵
  • شمارنده معکوس در وردپرس با Yith Topbar Countdown
  • بازدید : 896
  • تاریخ : ۲۳ - ۱۱ - ۱۳۹۴
  • مدیریت حساب کاربران در وردپرس با User Switching
  • بازدید : 335
  • تاریخ : ۵ - ۱۱ - ۱۳۹۵
  • قالب خبری میهن نیوز
  • بازدید : 6135
  • تاریخ : ۲۶ - ۰۶ - ۱۳۹۲
  • قالب خبری وردپرس newstube ورژن جدید
  • بازدید : 1564
  • تاریخ : ۱۰ - ۰۷ - ۱۳۹۵
  • پکیج حرفه ای سئو کاملا قدرتمند
  • بازدید : 644
  • تاریخ : ۲۵ - ۰۷ - ۱۳۹۵
  • کلیدهای میانبر در وردپرس به عبارتی shortcut keys
  • بازدید : 629
  • تاریخ : ۲۹ - ۱۲ - ۱۳۹۴
  • پوسته حرفه ای املاک با پنل مدیریت
  • بازدید : 10500
  • تاریخ : ۲۵ - ۰۲ - ۱۳۹۳
  • نظرات کاربران
      3252
    • نویسنده تحقیقات دانشگاه آزاد :

      خیلی مفید بود و اطلاعات خوبی ارائه دادید
      تشکر از سایت خوبتون

    • 4028
    • نویسنده طراحی سایت :

      سلام. متشکرم. خیلی خوب بود


    کد امنیتی : 3 + 5
    طراحی سایت

    طراحی وبسایت تخصص ماست ، شما می توانید برای مشاوره و دریافت قیمت از لینک زیر یا شماره های سایت اقدام نمائید.

    هم اکنون سفارش دهید
    newslatter

    خبرنامه :

    با عضویت در خبرنامه هــــــیچ یک از مطالب سایـت را از دسـت نخواهید داد و همیـشه بروز خواهـید بود

    خبرنامه اینترنتی
    load
    ربات پارس وردپرس

    ربات هوشمند پارس وردپرس

    هم اکنون وارد شوید
    همراه ما باشید ...
  • جدید ترین ها

  • افزونه ها

  • اخبار وردپرسی

  • لطفا شکیبا باشید ...
  • تبلیغات

  • کلیک کنید

    کدنویسی CSS3

    کدنویسی بوسیله استایل دهی برای زیباسازی و سرعت بارگذاری بهتر قالب ها .

    واکنشگرا

    قابلیت ریسپانسیو بودن برای نمایش بهتر در موبایل ها و تبلت ها .

    کدنویسی HTML5

    کدنویسی قالب برپایه جدیدترین متدهای روز انجام می پذیرد .

    پشتیبانی حرفه ای

    تیم پارس وردپرس از ساعت 9 صبح الی 20 پاسخگوی شما خواهد بود .

    پنل مدیریت آسان

    شما می توانید با پنل مدیریت قالب ، مدیریت آسان را تجربه کنید .

    طراحی سایت
    طراحی سایتسئوسرویس و تعمیر کولر گازیفروش ویلا و اجاره ویلااجاره ویلافروش ویلا
    telegram instagram