رفتن به مطلب

پست های پیشنهاد شده

سلام و دورود

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

ممنون

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

$(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

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


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

سلام و درود @unid_user

 

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

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

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


لینک به ارسال
در 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 صدا کردین؟

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


لینک به ارسال

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

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


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

وقت بخیر

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

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

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


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

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

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

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

 

موفق باشید

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


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

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

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

 

موفق باشید

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

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


لینک به ارسال
<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

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


لینک به ارسال
در 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 واحدش وارد نشده.

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


لینک به ارسال
در هم اکنون، 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 پس زمینه حرکت کنه.

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


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

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

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

مثلا

background-position: 50 150;

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

background-position: 50px 150px;

 

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


لینک به ارسال
در 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");
  });

 

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


لینک به ارسال
در 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'});

 

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


لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.


  • مطالب مشابه

    • توسط RZFURY
      سلام دوستان.
      سایت من به آدرس : funroid.ir
      مشکلش حرکت اسلایدر ها توی گوشی هست. با ویندوز مشکلی در حرکت دادنش وجود نداره و با ماوس راحت چپ و راست میره ولی وقتی سایتم رو توی گوشی باز میکنم و میخوام اسلایدر ها رو چپ و راست ببرم متاسفانه درجا میزنه و به درستی حرکت نمیکنه. کسی میدونه چجوری میشه درستش کرد. ممنون.
    • توسط Reka
      چطور با استفاده از  افزونه پارسی دیت میتونم خروجی جاوا اسکریپت رو تغییر بدم؟
      تابعی در افزونه پارسی دیت هست که بتونه روی جاوا اسکریپت تغییر ایجاد کنه؟
      میخوام روی خروجی این کد جاوا اسکریپت، شمسی سازی رو اعمال کنم.
      var d = new Date
      خروجی الان به این صورته
      Sun Mar 15 2020 07:36:16 GMT+0330 (Iran Standard Time)
    • توسط ramy1908
      درود، وقت دوستان بخیر
      یه سوال خیلی خیلی تخصصی داشتم، من برای سایتم اسلایدر jQuery استفاده می کنم.
      چطور میتونم بخشی ایجاد کنم ادمین فقط بعضی از مطالب رو وارد اسلایدر کنه، نمیخوام که یه دسته جداگانه واسه اسلایدر ایجاد کنم.
      راهی وجود داره برای این کار؟
    • توسط Neon_63
      سلام همگی. من در سایتم وقتی محصولی رو وارد سبد خرید میکنم و میرم به صفحه پرداخت، بهم ارور زیر رو میده:
      کتابخانه جی کوئری قبل از شهر های ایران لود نشده است!
      و بعد هم که یه استان رو انتخاب میکنم، در قسمت شهر ها میزنه "یافت نشد!"
      قالبش رو هم خودم نوشتم، اسم سایت هم رصد بوک هست. از آخرین نسخه وردپرس و ووکامرس هم استفاده میکنم
×
×
  • اضافه کردن...