unid_user

اسلایدر
مشکل با اجرا نشدن جی کوئری

15 پست در این موضوع قرار دارد

ارسال شده در (ویرایش شده)

سلام و دورود

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

ممنون

کد جاوا اسکریپت:

$(document).ready(function(){
  $("a:nth-child(1)").css("background-color","white");
  $("#circle1").click(function(){
    $("#slider").animate({'left':'5%'},500);
    $("#data").fadeIn(700);
    $("#data2,#data3,#data4").fadeOut(500);
    $(".line").animate({'left':'60%'});
    $("a:nth-child(1)").css("background-color","white");
    $("a:nth-child(2),a:nth-child(3),a:nth-child(4)").css("background-color","black");
  });
  $("#circle2").click(function(){
    $("#slider").animate({'left':'-30%'},500);
    $("#data2").fadeIn(700);
    $("#data,#data3,#data4").fadeOut(500);
    $(".line").animate({'left':'25%'});
    $("a:nth-child(2)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(3),a:nth-child(4)").css("background-color","black");
  });
  $("#circle3").click(function(){
    $("#slider").animate({'left':'-190%'},500);
    $("#data3").fadeIn(700);
    $("#data,#data2,#data4").fadeOut(500);
    $(".line").animate({'left':'55%'});
    $("a:nth-child(3)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(2),a:nth-child(4)").css("background-color","black");
  });
  $("#circle4").click(function(){
    $("#slider").animate({'left':'-240%'},500);
    $("#data4").fadeIn(700);
    $("#data,#data2,#data3").fadeOut(500);
    $(".line").animate({'left':'25%'});
    $("a:nth-child(4)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(2),a:nth-child(3)").css("background-color","black");
  });
});

 

site_4.zip

ویرایش شده در توسط unid_user
0

به اشتراک گذاری این پست


لینک به پست

سلام و درود @unid_user

 

توی کنسول مرورگر خطایی نشون نمیده؟

0

به اشتراک گذاری این پست


لینک به پست
در 2 دقیقه قبل، mehran-b گفته است :

سلام و درود @unid_user

 

توی کنسول مرورگر خطایی نشون نمیده؟

نه. فایل رو پیوست کردم اگه نیاز هست بررسی میکنید لطفا؟

0

به اشتراک گذاری این پست


لینک به پست
در 20 دقیقه قبل، unid_user گفته است :

سلام و دورود

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

ممنون

کد جاوا اسکریپت:


$(document).ready(function(){
  $("a:nth-child(1)").css("background-color","white");
  $("#circle1").click(function(){
    $("#slider").animate({'left':'5%'},500);
    $("#data").fadeIn(700);
    $("#data2,#data3,#data4").fadeOut(500);
    $(".line").animate({'left':'60%'});
    $("a:nth-child(1)").css("background-color","white");
    $("a:nth-child(2),a:nth-child(3),a:nth-child(4)").css("background-color","black");
  });
  $("#circle2").click(function(){
    $("#slider").animate({'left':'-30%'},500);
    $("#data2").fadeIn(700);
    $("#data,#data3,#data4").fadeOut(500);
    $(".line").animate({'left':'25%'});
    $("a:nth-child(2)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(3),a:nth-child(4)").css("background-color","black");
  });
  $("#circle3").click(function(){
    $("#slider").animate({'left':'-190%'},500);
    $("#data3").fadeIn(700);
    $("#data,#data2,#data4").fadeOut(500);
    $(".line").animate({'left':'55%'});
    $("a:nth-child(3)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(2),a:nth-child(4)").css("background-color","black");
  });
  $("#circle4").click(function(){
    $("#slider").animate({'left':'-240%'},500);
    $("#data4").fadeIn(700);
    $("#data,#data2,#data3").fadeOut(500);
    $(".line").animate({'left':'25%'});
    $("a:nth-child(4)").css("background-color","white");
    $("a:nth-child(1),a:nth-child(2),a:nth-child(3)").css("background-color","black");
  });
});

 

site_4.zip

وقت بخیر

کد جاواتونو در تگ head صدا کردین؟

0

به اشتراک گذاری این پست


لینک به پست

توی codepen تست میکنم درسته!؟ بنظرتون علتش چی میتونه باشه که توی سیستم خودم نمیاد؟

0

به اشتراک گذاری این پست


لینک به پست
در هم اکنون، miladalizadeh گفته است :

وقت بخیر

کد جاواتونو در تگ head صدا کردین؟

نه بخشی رو توی فایل جدا و بخش هم پیش از تگ بسته body

0

به اشتراک گذاری این پست


لینک به پست
در 7 دقیقه قبل، unid_user گفته است :

نه. فایل رو پیوست کردم اگه نیاز هست بررسی میکنید لطفا؟

شما از ورژن Slim جی کوئری استفاده کردید که بخش AJAX و افکت ها رو نداره.

از ورژن اصلی استفاده کنید.

 

موفق باشید

0

به اشتراک گذاری این پست


لینک به پست
در هم اکنون، mehran-b گفته است :

شما از ورژن Slim جی کوئری استفاده کردید که بخش AJAX و افکت ها رو نداره.

از ورژن اصلی استفاده کنید.

 

موفق باشید

از خود سایت جی کوئری گرفتم همین بود. لینک درستش رو میشه ارسال کنید؟

0

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

<script>
      var l1=$("#d");
      var l2=$("#a");
      var l3=$("#f");
      var l4=$("#t");

      var layer=$("#main");

      layer.mousemove(function(e) {
        var valuex=(e.pageX * -1 / 40);

        l1.css({'background-position':(valuex-200)+''+0});
        l2.css({'background-position':(valuex)+''+0});
        l3.css({'background-position':(valuex-200)+''+0});
        l4.css({'background-position':(valuex+600)+''+0});
      });
    </script>

حالا فقط بخش آخر مونده. کدهای جاوا اسکریپتی که پیش از تگ body گذاشتم کار نمیکنه. مربوط به mousemove هست. این کدها رو درون تگ head هم گذاشتم تغییری نکرد.

ویرایش شده در توسط unid_user
0

به اشتراک گذاری این پست


لینک به پست
در 9 دقیقه قبل، unid_user گفته است :

حالا فقط بخش آخر مونده. کدهای جاوا اسکریپتی که پیش از تگ body گذاشتم کار نمیکنه. مربوط به mousemove هست. این کدها رو درون تگ head هم گذاشتم تغییری نکرد.

نفهمیدم دقیقا باید چی بشه ولی توی این 4 تا:

l1.css({'background-position':(valuex-200)+''+0});
l2.css({'background-position':(valuex)+''+0});
l3.css({'background-position':(valuex-200)+''+0});
l4.css({'background-position':(valuex+600)+''+0});

background-position واحدش وارد نشده.

0

به اشتراک گذاری این پست


لینک به پست
در هم اکنون، mehran-b گفته است :

نفهمیدم دقیقا باید چی بشه ولی توی این 4 تا:


l1.css({'background-position':(valuex-200)+''+0});
l2.css({'background-position':(valuex)+''+0});
l3.css({'background-position':(valuex-200)+''+0});
l4.css({'background-position':(valuex+600)+''+0});

background-position واحدش وارد نشده.

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

0

به اشتراک گذاری این پست


لینک به پست
در 10 دقیقه قبل، unid_user گفته است :

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

وقتی عدد وارد بشه جلوی background-position بدون واحد غیر معتبر میشه.

مثلا

background-position: 50 150;

عبارات بالا کاملا برای CSS بی معنیه چون واحد نداره. باید به شکل زیر باشه:

background-position: 50px 150px;

 

0

به اشتراک گذاری این پست


لینک به پست
در 1 دقیقه قبل، mehran-b گفته است :

وقتی عدد وارد بشه جلوی background-position بدون واحد غیر معتبر میشه.

مثلا


background-position: 50 150;

عبارات بالا کاملا برای CSS بی معنیه چون واحد نداره. باید به شکل زیر باشه:


background-position: 50px 150px;

 

من یه کد دیگه رو امتحان کردم که کار میکنه اما میخوام دقیقا از همون کد قبلی استفاده کنم. این پروژه بر اساس یک ویدئو آموزشی هست و دقیقا همون ترتیب رو رعایت کردم.

کدی که خودم نوشتم و کار میکنه:

$("#d").mousemove(function(event) {
    $("#d").css("background-position","100px");
  });
  $("#d").mouseleave(function(event) {
    $("#d").css("background-position","-200px");
  });

 

0

به اشتراک گذاری این پست


لینک به پست
در 2 دقیقه قبل، unid_user گفته است :

من یه کد دیگه رو امتحان کردم که کار میکنه اما میخوام دقیقا از همون کد قبلی استفاده کنم. این پروژه بر اساس یک ویدئو آموزشی هست و دقیقا همون ترتیب رو رعایت کردم.

خوب کد خودت واحد داره کار میکنه اونا واحد نداره کار نمیکنه.

کدها رو اینطوری کن:

l1.css({'background-position':(valuex-200)+'px '+'0px'});
l2.css({'background-position':(valuex)+'px '+'0px'});
l3.css({'background-position':(valuex-200)+'px '+'0px'});
l4.css({'background-position':(valuex+600)+'px '+'0px'});

 

1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط ramy1908
      درود، وقت دوستان بخیر
      یه سوال خیلی خیلی تخصصی داشتم، من برای سایتم اسلایدر jQuery استفاده می کنم.
      چطور میتونم بخشی ایجاد کنم ادمین فقط بعضی از مطالب رو وارد اسلایدر کنه، نمیخوام که یه دسته جداگانه واسه اسلایدر ایجاد کنم.
      راهی وجود داره برای این کار؟
    • توسط Neon_63
      سلام همگی. من در سایتم وقتی محصولی رو وارد سبد خرید میکنم و میرم به صفحه پرداخت، بهم ارور زیر رو میده:
      کتابخانه جی کوئری قبل از شهر های ایران لود نشده است!
      و بعد هم که یه استان رو انتخاب میکنم، در قسمت شهر ها میزنه "یافت نشد!"
      قالبش رو هم خودم نوشتم، اسم سایت هم رصد بوک هست. از آخرین نسخه وردپرس و ووکامرس هم استفاده میکنم
    • توسط aref_05
      با سلام
      آیا با حذف اسلایدر  سرعت سایت بالا میره ؟ این کارو پیشنهاد می کنید؟
    • توسط mohammdkhalilii
      با سلام و عرض خسته نباشید به تمامی دوستانم ، سوالی که از خدمتتون داشتم 
      من یه افزونه میخوام که مثل این قسمت وبسایت http://irselfmade.com/ 
      هم توی موبایل و تبلت هم توی دسکتاپ اسلایدر (به قول معروف چرخ فلکی ) افقی باشه 
      ممنونم