پارس وردپرس

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

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

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

  • دسته بندی ها : آموزش
  • ۵ فروردین ۱۳۹۵
  • 562 بازدید
  • 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 ساعته پشتیبان شما می باشد و پس از واریز برایتان ارسال خواهد شد .

    مطالب تصادفی
    ساخت رزومه آنلاین در وردپرس با افزونه Resume Builder
  • بازدید : 1159
  • تاریخ : ۲۷ - ۱۲ - ۱۳۹۴
  • آموزش کاربردی htaccess برای وردپرس
  • بازدید : 553
  • تاریخ : ۲ - ۱۰ - ۱۳۹۴
  • پسندیدن نظرات در وردپرس با Comments Like Dislike
  • بازدید : 305
  • تاریخ : ۲۴ - ۰۹ - ۱۳۹۵
  • فوری وردپرس خود را به نسخه ۴٫۴٫۱ بروز رسانی کنید
  • بازدید : 1522
  • تاریخ : ۱۸ - ۱۰ - ۱۳۹۴
  • قالب خبری بسیار زیبای آنلاین نیوز + پنل مدیریت
  • بازدید : 8160
  • تاریخ : ۲ - ۰۴ - ۱۳۹۳
  • مهم ترین تفاوت های SEO و SEM در چیست؟
  • بازدید : 704
  • تاریخ : ۲۶ - ۰۹ - ۱۳۹۴
  • اضافه نمودن آیکون به منوی وردپرس
  • بازدید : 629
  • تاریخ : ۲۱ - ۰۸ - ۱۳۹۴
  • محافظت از وردپرس در مقابل هکرها
  • بازدید : 508
  • تاریخ : ۴ - ۱۲ - ۱۳۹۴
  • ریست سریع وردپرس با wordpress database reset
  • بازدید : 324
  • تاریخ : ۱۶ - ۰۳ - ۱۳۹۶
  • درج خودکار qr code در مطالب وردپرس
  • بازدید : 532
  • تاریخ : ۱۴ - ۰۲ - ۱۳۹۴
  • پرتال خبری شهرداری با پنل مدیریت
  • بازدید : 6578
  • تاریخ : ۳۰ - ۱۰ - ۱۳۹۳
  • نظرات کاربران
      3252
    • نویسنده تحقیقات دانشگاه آزاد :

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


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

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

    هم اکنون سفارش دهید
    مطالب برتر ماه
    newslatter

    خبرنامه :

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

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

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

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

  • افزونه ها

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

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

  • کلیک کنید

    کدنویسی CSS3

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

    واکنشگرا

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

    کدنویسی HTML5

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

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

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

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

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

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