تبلیغات در اینترنت

تبلیغات در اینترنتگیفت کارت گوگل پلی
صفحه 1 از 3 123 آخرینآخرین
نمایش نتایج: از 1 به 10 از 21

مقاله: آموزش ایجاد کردن یک کادر اطلاع رسانی + هاور انیمیشن

    1. آموزش ایجاد کردن یک کادر اطلاع رسانی + هاور انیمیشن »

      آموزش ایجاد کردن یک کادر اطلاع رسانی + هاور انیمیشن

      نگارش: , by (مدیریت کل سایت)
      2012/04/11 05:56 PM
      امتیاز: 

      درود.

      با استفاده از این آموزش مبتدیان میتوانند یک کادر با قابلیت انیمیشن به هنگام رفتن روی ماوس با CSS ایجاد کنید .

      نمونه کادر :



      کد های زیر را در انتهای قالب additional.css قرار دهید :

      کد:
      .etelaresani_vbiran {
      background: #f2d3d3;
      border: 1px solid #d19797;
      color: #3E3E3E;
      padding: 5px 10px;
      margin-bottom: 5px;
      text-align: right;
      clear: both;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      text-shadow: 1px 1px white;
          -webkit-transition : all 0.5s ease-in;
          -moz-transition : all 0.5s ease-in;
          -o-transition : all 0.5s ease-in;
      
      }
      
      .etelaresani_vbiran:hover {
      background:white;
      border:1px solid #cecece;
          -webkit-transition : all 0.5s ease-in;
          -moz-transition : all 0.5s ease-in;
          -o-transition : all 0.5s ease-in;
      }
      کد های زیر را هر جا که دوست دارید مثلاً ته قالب navbar قرار دهید :

      <div class="etelaresani_vbiran">
      در صورتی که سفارشی داشتید و ایمیل ارسال کردید و هنوز نیاز شما مرتفع نشده است ایمیل خود را مجددا ارسال کنید . <br /><br />
      سرور سایت وی بی ایران در حال تعمیر میباشد لذا ممکن است مشکلاتی در سایت وجود داشته باشد که پیش بینی میشود تا ساعات آینده حل شود . از مشکل بوجود آمده پوزش میخواهیم .
      </div>


      1. در کد های بالا قسمت هایی که در ابتدا دارای # هستند کد رنگ هستد .

      کد اچ تی ام ال رنگ ها

      2. کد <br /> به منزله یک اینتر یا پیج برک می باشد .

      3. قسمت هایی که 5px هستند میزان گردی را نشان میدهند اگر میخواهید گرد تر کنید هر 3 را تغییر دهید .

      4. قسمتی که دارای :hover میباشد برای زمانی است که ماوس روی کادر میرود که همانطور که میبینید قرار هست بکگراند وایت ( سفید ) و بردر توسی ( #cecece ) باشه.

      اگر به CSS وارد باشید میتونید قابلیت های دیگه هم اضافه کنید مثلاً :

      اضافه شدن سایه

      گرد تر شدن گوشه ها

      تغییر فونت

      و ..

      موفق باشید.
  1. Top | #2
    کاربر سایت

    ورژن ویبولتین
    به چه دردت میخوره
    نوشته ها
    718
    میزان امتیاز
    80

    پیش فرض

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

  2. Top | #3
    کاربر سایت

    ورژن ویبولتین
    3
    نوشته ها
    143
    میزان امتیاز
    20

    پیش فرض

    این قالب additional.css کجاست ؟

    وی بی 3.8.7

  3. Top | #4
    مدیر بازنشته

    ورژن ویبولتین
    4.2.0
    نوشته ها
    3,040
    میزان امتیاز
    402

    پیش فرض

    در وی بی ورزن 3 به اسم دیگری هست .

  4. Top | #5
    کاربر سایت

    ورژن ویبولتین
    4.2
    نوشته ها
    656
    میزان امتیاز
    71

    پیش فرض

    سلام
    میشه توی این کادر لینک هم اضافه کرد

  5. Top | #6
    مدیر بازنشته

    ورژن ویبولتین
    4.2.0
    نوشته ها
    1,424
    میزان امتیاز
    168

    پیش فرض

    بله یا استفاده ازین کد:
    <a href="ADDRESS LINK">TOZIHAT</a>

  6. Top | #7
    کاربر سایت

    ورژن ویبولتین
    4.2.2
    نوشته ها
    432
    میزان امتیاز
    51

    پیش فرض

    دست شما درد نکنه فقط یه سوال : اقا بعد از اینکه این کلس اضافه شد ، آیا میشه توی اطلاع رسانی ها به کارش برد یا اینکه باید محتوای درونش دستی به نوبار اضافه بشه ؟

  7. Top | #8
    کاربر سایت

    ورژن ویبولتین
    4.2
    نوشته ها
    656
    میزان امتیاز
    71

    پیش فرض

    چطوری میشه ارتفاع این کادر رو نیم سانت بیشتر کرد چون پایین حروف رو میپوشونه

  8. Top | #9
    مدیر بازنشته

    ورژن ویبولتین
    X.X.X
    نوشته ها
    2,643
    میزان امتیاز
    339

    پیش فرض

    کد:
    etelaresani_vbiran. { background: #f2d3d3; border: 1px solid #d19797; color: #3E3E3E; padding: 5px 10px; margin-bottom: 5px; text-align: right; clear: both; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow: 1px 1px white;     -webkit-transition : all 0.5s ease-in;     -moz-transition : all 0.5s ease-in;     -o-transition : all 0.5s ease-in;
    
    height:Xpx;  }  .etelaresani_vbiran:hover { background:white; border:1px solid #cecece;     -webkit-transition : all 0.5s ease-in;     -moz-transition : all 0.5s ease-in;     -o-transition : all 0.5s ease-in; }
    به جای
    height:Xpx;

    جای x یه عدد بزارید که با کادر ست شه

    کاربر مقابل از Revenger بابت این پست مفید تشکر کرده است:


  9. Top | #10
    کاربر سایت

    ورژن ویبولتین
    4.1
    نوشته ها
    108
    میزان امتیاز
    15

    پیش فرض

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

    lمثل این سایت می خوام؟

    چیکار کنم؟

صفحه 1 از 3 123 آخرینآخرین

اطلاعات موضوع

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

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کسانی که این مقاله را دیده اند از این مقاله ها نیز بازدید کرده اند

  1. آموزش آپگراید ویبولیتن ورژن 3 به 4 ( اموزش تصویری )
    توسط Reza در انجمن اموزشهای تصویری ویبولتین
    پاسخ: 5
    آخرين نوشته: 2014/11/17, 09:38 PM
  2. پاسخ: 14
    آخرين نوشته: 2012/01/22, 02:10 PM
  3. پاسخ: 0
    آخرين نوشته: 2012/01/13, 02:11 PM

کلمات کلیدی این موضوع

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •