• 0 رای - 0 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
حرکت روان
#1
Wink 
چجوری می تونم با جاوا اسکریپت یک ابجکت HTML رو حرکت بدم که حرکت روان باشه. استفاده از timer چطوره؟
  پاسخ
تشکر شده توسط :
#2
با جی کوئری:
کد:
http://stackoverflow.com/questions/938655/jquery-moving-from-postion-x-to-position-y-slowly-animation

با خود جاوااسکریپت :
کد:
http://www.codingforums.com/showthread.php?t=174464

اینا می تونن کمکت کنن
همه جوره اش رو داریم ظاهرن
  پاسخ
تشکر شده توسط :
#3
(۱۳۹۱ مرداد ۳۰, ۰۲:۴۲ ب.ظ)miladr24 نوشته: چجوری می تونم با جاوا اسکریپت یک ابجکت HTML رو حرکت بدم که حرکت روان باشه. استفاده از timer چطوره؟

چرا از jQuery استفاده نمی کنی
راحت تره ها Big Grin
مثلا یه دایو داری مثل زیر

کد پی‌اچ‌پی:
<div id="mim"></div

خب Tongue، بعد اینجوری هم استایل دادی

کد پی‌اچ‌پی:
#mim {
    
width100px;
    
height100px;
    
positionabsolute;
    
top100px;
    
left10px;
    
background-color#f00;


حالا توی head که جی کوئری رو import کردی یه کد مثل پایینی بزن

کد پی‌اچ‌پی:
$(document).ready(function(){
  $(
'#mim').bind('click', function(){
    $(
this).animate({left:'+=200'}, 1000);
  });
}); 

حالا هر دفعه که روش کلیک کنی 200 تا میره سمت راست Big Grin

اینم دمو برو ببین
http://codepen.io/masoudmanson/pen/cjnDa

Big Grin
W H A T E V E R   Sleepy 
  پاسخ
تشکر شده توسط :
#4
جی کوئری نمیخواد ، فقط css3 Tongue
کد:
<style>
a
{
    display:block;
    padding:0px;
    
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
}
a:hover
{
    padding-right:20px;
    
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
}

</style>

<a href='#'>Look At me !</a>
وبلاگ rezaonline.net/blog
سفارش برنامه نویسی reza.biz
Php , mysql , postgresql , redis , Yii and ... Cool
  پاسخ
تشکر شده توسط : masoudmanson
#5
(۱۳۹۱ مرداد ۳۰, ۰۲:۵۹ ب.ظ)Reza نوشته: جی کوئری نمیخواد ، فقط css3 Tongue

میلاد خودش گفت با جاوااسکریپت Big Grin
تو که میدونی داداش رضا
من رای CSS رو به جاوااسکریپت نمی دم Tongue Dodgy
W H A T E V E R   Sleepy 
  پاسخ
تشکر شده توسط : Reza
#6
بدون import جی کوئری چی؟ با جاوااسکریپت پایه نمیشه کاری کرد؟
CSS 3 رو همه مرورگر ها پشتیبانی نمی کنه...
  پاسخ
تشکر شده توسط :


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان