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

تبلیغات در اینترنتگیفت کارت گوگل پلی
نمایش نتایج: از 1 به 9 از 9

مقاله: آموزش کامل JQuery اختصاصی وی بی ایران - جلسه سوم

    1. آموزش کامل JQuery اختصاصی وی بی ایران - جلسه سوم »

      آموزش کامل JQuery اختصاصی وی بی ایران - جلسه سوم

      نگارش: , by (مدیریت ارشد وی بی ایران)
      2013/04/15 11:03 PM
      امتیاز: 

      درود.
      با وقفه بسیار طولانی امروز جلسه سوم آموزش جی کوئری رو با هم آغاز میکنیم.

      من ابتدا عضذر میخوام بابت این وقفه های طولانی و سعی میکنم فاصله بین دو جلسه کمتر بشه : )

      برای این جلسه به توضیحاتی در مورد نوشتن کد های جی کوئری و ساخت یک جعبه حذف شونده به عنوان مثال میپردازیم.


      __ __ __

      ما الان کد های زیر رو به عنوان کد های پایه داریم:

      کد:
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>Untitled Document</title>
      <script type="text/javascript" src="jquery-1.9.1.min.js"></script>
      
      
       <script type="text/javascript"> 
      
      
      </script>
      </head>
      <body>
      
      
      
      
      
      
      </body>
      </html>
      در قسمت

      کد:
       <script type="text/javascript"> 
      
      </script>
      کد های جی کوئری خودمون رو مینویسیم.

      معمولا قبل از هر چیز کد زیر رو وارد میکنیم:

      کد:
      $(document).ready(function()
      این کاربرای این هست که حتما وقتی سایت کامل لود شد،کد های جی کوئری اجرا بشند.
      چون در غیر این صورت ممکنه مثلا هنوز یک دایو لود نشده و ما اون رو میبندیم!!


      کد های جی کوئری رو با علامت زیر میبندیم:

      کد:
      });
      به طور کلی کد های جی کوئری به این صورت هستند:

      کد:
      $(شیئ مورد نظر در صفحه).دستور();

      برای مثال،ما میخوایم یک عکس رو از صفحه محو کنیم!

      برای اینکه به مشکل نخوریم اول یک دایو برای تصویرمون در نظر میگیریم بعد عکس رو وارد میکنیم.
      به این شکل:

      کد HTML:
      <div class="ddxv"><img src="http://youforum.ir/forum/images/VBIran_GR/cross.png"></div>
      من در اینجا از دایو ddxv استفاده کردم که هیچ معنایی نداره و کاملا دلخواه هست

      برای محو کردن این تصویر از دستور .hide استفاده میکنیم و برای اینکه به صفحه بفهمونیم وقتی روی تصویر کلیک شد این اتفاق بیفته از دستور .click استفاده میکنیم!

      چون دایو ما ddxv هست،پس کد ما به این شکل میشه:

      کد:
      $(document).ready(function(){  $(".ddxv").click(function(){
          $(this).hide();
        });
      });
      و در نهایت کد صفحه ما به این شکل خواهد بود:

      کد HTML:
      <!DOCTYPE html><html><head><script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><script>$(document).ready(function(){  $(".ddxv").click(function(){    $(this).hide();  });});</script></head><body>
      <div class="ddxv"><img src="http://youforum.ir/forum/images/VBIran_GR/cross.png"></div></body></html>

      آموزش های امروز رو تمرین کنید تا در این دستورات روان بشید تا راحت تر به سراغ دستورات دیگه بریم.


      ___ ___ ____


      این جلسه هم به پایان رسید.
      امیدوارم لذت برده باشید!


      آموزش کامل JQuery اختصاصی وی بی ایران - جلسه اول
      آموزش کامل JQuery اختصاصی وی بی ایران - جلسه دوم

      موفق باشید.
  1. Top | #2
    مدیر بازنشته

    ورژن ویبولتین
    4
    نوشته ها
    2,571
    میزان امتیاز
    304

    پیش فرض

    یه سوال
    میشه خواص سی اس اس رو به همراه افکت عوض کرد؟؟؟؟؟؟؟
    مثلا ما میزنیم
    کد:
    (this).css(background: black)
    حالا رویداد که انجام شد اون آی دی مورد نظر باید بک گراندش سیاه بشه
    حالا من میخوام با افکت fade این بک گراند واسش بیاد
    آیا میشه؟؟؟؟

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

    ورژن ویبولتین
    4.2
    نوشته ها
    3,836
    میزان امتیاز
    473

    پیش فرض

    نقل قول نوشته اصلی توسط Roach نمایش پست ها
    یه سوال
    میشه خواص سی اس اس رو به همراه افکت عوض کرد؟؟؟؟؟؟؟
    مثلا ما میزنیم
    کد:
    (this).css(background: black)
    حالا رویداد که انجام شد اون آی دی مورد نظر باید بک گراندش سیاه بشه
    حالا من میخوام با افکت fade این بک گراند واسش بیاد
    آیا میشه؟؟؟؟
    استایل های css رو میتونید جداگانه به صفحه اضافه کنید.

    مثلا در همین کد،برای استیال دهی باید به صورت زیر عمل کنید:

    کد HTML:
    <!DOCTYPE html><html><head><script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><script>$(document).ready(function(){  $(".ddxv").click(function(){    $(this).hide();  });});</script>
    <style>
    .ddxv{Your CSS STYLES}
    
    </style
    </head><body>
    <div class="ddxv"><img src="http://youforum.ir/forum/images/VBIran_GR/cross.png"></div></body></html>

    2 تشکر توسط:


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

    ورژن ویبولتین
    4
    نوشته ها
    2,571
    میزان امتیاز
    304

    پیش فرض

    خب نه میدونم اینو
    من منظور اصلیم اینه که استایل سی اس اس ها هم با افکت عوض بشه

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


  4. Top | #5


    ورژن ویبولتین
    4.2.2
    نوشته ها
    1,075
    میزان امتیاز
    219

    پیش فرض

    می تونید سرعت رو از پارامتر های ورودی جی کوئری تعیین کنید یا از کد سی اس اس زیر استفاده کنید در کلاس مد نظر:

    -webkit-transition:all0.6sease-in-out;-moz-transition:all0.6sease-in-out;-o-transition:all0.6sease-in-out;

    5 تشکر توسط:


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

    ورژن ویبولتین
    5
    نوشته ها
    1,305
    میزان امتیاز
    139

    پیش فرض

    ممنون

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

    ورژن ویبولتین
    4.2
    نوشته ها
    3,836
    میزان امتیاز
    473

    پیش فرض

    نقل قول نوشته اصلی توسط imaniy نمایش پست ها
    ممنون
    خواهش میکنم.
    ضمنا;
    برای تشکر از نویسنده روی کلیک کنید .

    2 تشکر توسط:


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

    ورژن ویبولتین
    4.2.2
    نوشته ها
    4
    میزان امتیاز
    0

    پیش فرض

    با سلام
    ببخشید اگه تایپیک قدیمیه و من اینجا سوال میپرسم
    امیدوارم موردی نباشه !!
    من توی سایتم روی یک div توی css خاصیتی دادم که width اون با کلیک روی اون عوض بشه و وقتی کلیک برداشته شد ، اون به width اولیه خودش برگرده
    اما با jquery یک div دیگر رو با اون تغییر width میدم که با کلیک روی اون اولیه ، طول دومی هم تغییر کنه
    ولی وقتی موس رو برمیدارم ، اولی به مقدار اولیه خودش برمیگرده ولی دومی که با jquery المنت استایل میده ، به طول اولیه برنمیگرده ..
    میشه بگید چطوری باید این مشکل رو توی jquery درست کنم ؟
    ممنون

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

    ورژن ویبولتین
    4.2.2
    نوشته ها
    4
    میزان امتیاز
    0

    پیش فرض

    up ..
    لطفا خیلی به این نیاز دارم
    کارم گیره رو این !

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

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

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

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

  1. آموزش کامل JQuery اختصاصی وی بی ایران - جلسه اول
    توسط AmirAshkan در انجمن اموزشهای تصویری ویبولتین
    پاسخ: 14
    آخرين نوشته: 2013/07/13, 08:51 AM
  2. آموزش کامل JQuery اختصاصی وی بی ایران - جلسه دوم
    توسط AmirAshkan در انجمن آموزش های وی بولتین
    پاسخ: 6
    آخرين نوشته: 2013/04/08, 05:44 PM
  3. آموزش کامل HTML اختصاصی وی بی ایران - جلسه سوم
    توسط Leberman در انجمن آموزش های وی بولتین
    پاسخ: 13
    آخرين نوشته: 2013/03/29, 08:29 PM

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

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

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

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