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

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط unid_user
      سلام و درود
      دوستان گرامی ، می خوام یه منوی آکاردئونی ساده با جی کوئری ایجاد کنم که وقتی روی هر کدوم از آیتم های منو کلیک میکنی، زیر منوی سایر آیتم ها بسته بشه.
      <nav> <ul id="first-ul"> <li> <a>صفحه اصلی</a> </li> <li> <a>خدمات</a> <ul class="second-ul"> <li> <a>آموزش رباتیک</a> </li> <li> <a>طراحی و ساخت ربات</a> </li> </ul> </li> <li> <a>محصولات</a> <ul class="second-ul"> <li> <a>ربات مسیریاب</a> </li> <li> <a>ربات حل ماز</a> </li> </ul> </li> </ul> </nav> با تشکر و سپاس
    • توسط jistili1
      سلام دوستان.من یک select box دارم و قرار بر اینه که به ازای هر مقدار select box یک div خاص نمایش داده بشه و بقیه div های مربوط به مقادیر دیگر select box مخفی بشن.
      این کد جی کوئری من هست:
      $("#select").change(function(){ if($(this).val()=="empty"){ $("#date").css("display","hidden"); $("#localref").css("display","hidden"); $("#refid").css("display","hidden"); $("#number").css("display","hidden"); $("#product").css("display","hidden"); $("#price").css("display","hidden"); } if($(this).val()=="localref"){ $("#date").css("display","hidden"); $("#localref").css("display","block"); $("#refid").css("display","hidden"); $("#number").css("display","hidden"); $("#product").css("display","hidden"); $("#price").css("display","hidden"); } if($(this).val()=="date"){ $("#date").css("display","block"); $("#localref").css("display","hidden"); $("#refid").css("display","hidden"); $("#number").css("display","hidden"); $("#product").css("display","hidden"); $("#price").css("display","hidden"); } if($(this).val()=="price"){ $("#date").css("display","hidden"); $("#localref").css("display","hidden"); $("#refid").css("display","hidden"); $("#number").css("display","hidden"); $("#product").css("display","hidden"); $("#price").css("display","block"); } if($(this).val()=="number"){ $("#date").css("display","hidden"); $("#localref").css("display","hidden"); $("#refid").css("display","hidden"); $("#number").css("display","block"); $("#product").css("display","hidden"); $("#price").css("display","hidden"); } if($(this).val()=="product"){ $("#date").css("display","hidden"); $("#localref").css("display","hidden"); $("#refid").css("display","hidden"); $("#number").css("display","hidden"); $("#product").css("display","block"); $("#price").css("display","hidden"); } if($(this).val()=="refid"){ $("#date").css("display","hidden"); $("#localref").css("display","hidden"); $("#refid").css("display","block"); $("#number").css("display","hidden"); $("#product").css("display","hidden"); $("#price").css("display","hidden"); } }); حالا مشکل من اینجاست که فرض کنید من از توی select box ، مقدار date رو انتخاب کردم.خب تا اینجا درست کار میکنه و div مربوط به date برای من نمایش داده میشه.حالا اگه روی مقدار empty کلیک کنم ، طبق کد باید تمامی div ها مخفی بشن ولی این اتفاق نمیفته.حالا من از select box مقدار date رو انتخاب کردم و div مربوط به date برام نمایش داده میشه اگه بعدش روی گزینه localref کلیک کنم ، div مربوط به localref نمایش داده میشه ولی div مربوط به date مخفی نمیشه.ممنون میشم کمکم کنید که بفهمم مشکل از کجاست.
    • توسط unid_user
      سلام و درود
      دوستان گرامی ، نمیدونم چرا وقتی صفحه مرورگر رو رفرش میکنم، تمام زیر منوها دیده میشه! کسی میدونه علت چیه.
      با اینکه من تگ ul رو diplay: none دادم.
      با تشکر و سپاس
    • توسط ahmad25532
      سلام. این سایت با جوملاست ظاهرا
      http://hamagroup.ir/fa/
      داخل اسلایدرش یه سری خطوط هستند که در حال چرخش هستند. چجوری میتونم همچین چیزی تو سایت وردپرسیم بسازم. قالبم اسلاید رولوشن و لایر اسلایدر رو داره.
       
      ممنون
    • توسط unid_user
      سلام و درود
      دوستان گرامی ، کسی میدنه چطور باید از datepicker فارسی استفاده کنم؟ من طبق این مقاله آموزشی انجام دادم اما هیچی نشون نمیده؟!
      با تشکر و سپاس