jQuery to javascript

این تاپیک 8 پاسخ و 3 مشارکت کننده دارد . آخرین آپدیت توسط :  N4H ،‏ 1 سال و 4 ماه پیش .

این تاپیک تاکنون 406 بازدید داشته است .

تگ شده :  

نویسنده پست
جمعه ، 7 آگوست 2015     10:52 ب.ظ #


سعید

Subscriber
161 پست35 تاپیک

سلام

ایا میشه این کدهای جی کوری رو به جاوا اسکریپت تبدیل کرد تا نیازی به کتابخانه جی کوری نداشته باشم؟

کدها:

$(document).ready(function(){
$(".box").mouseenter(function(){
$(this).find(".box-1").animate({top:"-2px"},180)
$(this).find(".box-2").animate({bottom:"-2px"},180)})
$(".box").mouseleave(function(){
$(this).find(".box-1").stop();
$(this).find(".box-2").stop();
$(this).find(".box-1").animate({top:"-63px"},180)
$(this).find(".box-2").animate({bottom:"-63px"},180)})
$(".txt").click(function(){
$(".collapsed").find(".box-3").animate({left:"120px"},250)
$(".collapsed").find(".close").animate({marginRight:"-22px"},250)
$(".collapsed").find(".box-1,.box-2").animate({opacity:"0.5"},200)
$(".collapsed").removeClass("collapsed")
element=($(this).parent()).parent()
element.find(".box-1").animate({top:"-63px"},180)
element.find(".box-2").animate({bottom:"-63px"},180)
element.find(".box-1,.box-2").animate({opacity:"0"},200)
element.find(".box-3").animate({left:"-2px"},250)
element.find(".close").animate({marginRight:"13px"},250)
element.addClass("collapsed")})
$(".close").click(function(){
$(".collapsed").find(".box-3").animate({left:"120px"},250)
$(".collapsed").find(".close").animate({marginRight:"-22px"},250)
$(".collapsed").find(".box-1,.box-2").animate({opacity:"0.5"},200)
$(".collapsed").find(".box-1").animate({top:"-2px"},180)
$(".collapsed").find(".box-2").animate({bottom:"-2px"},180)
$(".collapsed").removeClass("collapsed")})
})

0  تشکر
شنبه ، 8 آگوست 2015     9:25 ق.ظ #


آرمین نادری

ناظم
389 پست39 تاپیک

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

1  تشکر
شنبه ، 8 آگوست 2015     9:49 ق.ظ #


سعید

Subscriber
161 پست35 تاپیک

اقا ارمین css چی؟

میشه به css تبدیل کرد؟

0  تشکر
شنبه ، 8 آگوست 2015     9:51 ق.ظ #


سعید

Subscriber
161 پست35 تاپیک

با hover و animation میشه این افکت ها رو ایجاد کرد؟

0  تشکر
شنبه ، 8 آگوست 2015     10:00 ق.ظ #


آرمین نادری

ناظم
389 پست39 تاپیک

بله افکت ها رو میشه با css درست کرد ولی چرا میخواید اینکارو بکنید ؟

0  تشکر
شنبه ، 8 آگوست 2015     10:06 ق.ظ #


سعید

Subscriber
161 پست35 تاپیک

می خوام دیگه نیازی به کتابخانه جی کوری نداشته باشم و حجم کدها با این روش کمتر بشه
با css میشه دقیقا مثه اون افکت ها رو ساخت؟

0  تشکر
شنبه ، 8 آگوست 2015     10:23 ق.ظ #


آرمین نادری

ناظم
389 پست39 تاپیک

بله اصل افکت های مورد استفاده در جی کوئری با استفاده از css هست که با کد های جی کوئری روی المان ها اعمال میشن .

0  تشکر
شنبه ، 8 آگوست 2015     1:18 ب.ظ #


سعید

Subscriber
161 پست35 تاپیک

می تونین افکت box-1 و box-2 رو بسازین؟

من نتونستم بسازم

0  تشکر
شنبه ، 8 آگوست 2015     4:44 ب.ظ #


N4H

Subscriber
43 پست0 تاپیک

<p>1</p>

0  تشکر
پست 1 تا 9 (از مجموع 9 پست)

برای پاسخ دادن به این تاپیک باید وارد سایت شوید .