درخواست کمک: دکمه Arrow برای اسلایدر
سلام دوستان من میخوام برای اسلایدرم دکمه های next و prev بذارم ... میشه کمکم کنید؟؟
کد HTML:
<ul id="slides"> <li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/Minecraft.jpg" /></li> <li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/2.jpg" /></li> <li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/3.jpg" /></li> <li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/4.jpg" /></li></ul><div id="overlay" style="background:#26292E; width:100%; height:100%; position:absolute; top:0px; right:0px; z-index:2; opacity:0.5;"></div><a id="right-control">‹</a><a id="left-control">›</a>
کد:
/* Switching Slides */ $(document).ready(function(){
$("#slides li:gt(0)").hide();
setInterval(function() {
$('#slides li:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slides');
}, 4000);
});
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
دوستان کدهارو دیگ css شو نذاشتم ... فکر نکنم نیازم باشه
الان اسلایدر کار میکنه فقط میخوام دکمه بعدی قبلی داشته باشه
پلاگین آماده جی کوئری هم نباشه ... لطفا اگر بلدید بنویسید
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
دوستان کلا کسی جواب نمی ده؟؟
من از این انجمن تعریف شنیده بودم !!
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
با توجه به اینکه خودتون تا ایتجاشو نوشتین من تئوریشو میگم خودتون کامل کنید
هر عکسی که fadein میشه رو بهش یه کلاس مشخص اختصاص بده
بعد وقتی کاربر روی دکمه next کلیک کرد بر اساس اون کلاس بفهم فرزند چندمه بعد عدد بدست اومده ره به علاوه ۱ کن(جواب میشه عکس بعدی که باید نمایش داده بشه ) و اون رو نمایش بده
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
توضیح عالی بود
من کد رو به صورت زیر تغییر دادم :
کد:
/* Switching Slides */
$(document).ready(function(){
$("#slides li:gt(0)").hide();
setInterval(function() {
$('#slides li:first')
.fadeOut(1000)
.removeClass('soosk')
.next()
.fadeIn(1000)
.addClass('soosk')
.end()
.appendTo('#slides');
}, 4000);
});
این حذف و اضافه کلاس ! درسته؟؟
در مورد فرزند چندم هم یک توضیح میدید چطور بدست میاد؟؟ من خیلی با jQuery آشنایی ندارم متاسفانه
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
سلام از هر سایتی که پلاگین اسلایدر را دانلود کنید در قسمت توضیحات همه این موارد اورده شده
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
نقل قول:
نوشته اصلی توسط
raminrrrrrr
سلام از هر سایتی که پلاگین اسلایدر را دانلود کنید در قسمت توضیحات همه این موارد اورده شده
من پلاگین دانلود نکردم میخوام خودم بنویسم ... فقط کتابخانه query اضافه شده
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
نقل قول:
نوشته اصلی توسط
jNaghiloo
من پلاگین دانلود نکردم میخوام خودم بنویسم ... فقط کتابخانه query اضافه شده
اها من آشنایی با زبان جاو اسکریپت ندارم وبرای اسلایدر از از پلاگین آماده استفاده میکنم...شرمنده دوست عزیز
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
اره کارت درست بود
برای پیدا کردن فرزند از این دستور استفاده کن
کد HTML:
index = $( "Classname" ).index();
میشه:
index = $( ".soosk" ).index();
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
نقل قول:
نوشته اصلی توسط
vpsman
اره کارت درست بود
برای پیدا کردن فرزند از این دستور استفاده کن
کد HTML:
index = $( "Classname" ).index();
میشه:
index = $( ".soosk" ).index();
دوست عزیز بابت توضیحات سپاس
به دلیل دانش کمم نتونستم پیاده سازی کنم
میشه کدش رو بنویسی تا باعث یادگیری هم بشه؟؟
بابت صبر و حوصله برای توضیح ممنون...
==============
مرجع فارسی مبتدی برای آموزش jQuery داری برای شروع؟؟
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
سعی کردم خیلی ساده طرز استفادشو برات بنویسم.
البته خودت تغییرش بده و بهتره هر تیکه رو یه فانکشن کنی که از بازنویسی جلوگیری بشه
کد HTML:
$(document).ready(function(){
$("#slides li:gt(0)").hide();
setInterval(function() {
$('#slides li:first')
.fadeOut(1000)
.removeClass('soosk')
.next()
.fadeIn(1000)
.addClass('soosk')
.end()
.appendTo('#slides');
}, 4000);
$(".next").click(function(){
activeid = $("#slides li.soosk").index()
nextshow = activeid+1;
$("#slides li").hide();
$("#slides li").eq(nextshow).fadeIn(1000)
})
});
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
عالی بود کار میکنه ولی یک مشکل هست که با یک کلیک نمیره اسلاید بعدی
یک بار دو تا کلیک میکنم میره دفعه بعد 4 بار باز دو بار و ...
اصلا نظم خاصی نداره !!
من بجای کلاس next که شما گذاشتید از آیدی right-control استفاده کردم که تو کدهام هست
کد:
/* Switching Slides */
$(document).ready(function(){
$("#slides li:gt(0)").hide();
setInterval(function() {
$('#slides li:first')
.fadeOut(1000)
.removeClass('soosk')
.next()
.fadeIn(1000)
.addClass('soosk')
.end()
.appendTo('#slides');
}, 4000);
$("#right-control").click(function(){
activeid = $("#slides li.soosk").index()
nextshow = activeid+1;
$("#slides li").hide();
$("#slides li").eq(nextshow).fadeIn(1000)
});
});
می تونید اینجا ببینید: همون اسلایدر اول صفحه: Zebco.ir
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
به این دلیله که شما ساختارت این شکلیه که همه عکسها رو تو LI اولی داری میریزی و نشون میدی!!! درسته؟
سعی کن هر LI تو جای خودش حالتش show بشه (به ترتیب پشت سر هم)
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
نقل قول:
نوشته اصلی توسط
vpsman
به این دلیله که شما ساختارت این شکلیه که همه عکسها رو تو LI اولی داری میریزی و نشون میدی!!! درسته؟
سعی کن هر LI تو جای خودش حالتش show بشه (به ترتیب پشت سر هم)
من ساختار رو گذاشتم بازم می ذارم:
کد:
<ul id="slides">
<li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/Minecraft.jpg" /></li>
<li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/2.jpg" /></li>
<li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/3.jpg" /></li>
<li style=""><img src="<?php bloginfo('template_url'); ?>/images/slider/4.jpg" /></li>
</ul>
<div id="overlay" style="background:#26292E; width:100%; height:100%; position:absolute; top:0px; right:0px; z-index:2; opacity:0.5;"></div>
<a id="right-control">‹</a>
<a id="left-control">›</a>
در ضمن من یک مشکل دیگ هم پیدا کردم
الان دکمه prev هم ساختم و میزنم بره غقب به مشکل میخوره و با اون چهارثانیه که برا هر اسلاید گذاشتم تداخل داره
در صورتیکه وقتی میره عقب تازه 4 ثانیه اون اسلاید شروع بشه
- - - Updated - - -
نقل قول:
نوشته اصلی توسط
vpsman
به این دلیله که شما ساختارت این شکلیه که همه عکسها رو تو LI اولی داری میریزی و نشون میدی!!! درسته؟
سعی کن هر LI تو جای خودش حالتش show بشه (به ترتیب پشت سر هم)
من از همین کد جی کوئری استفاده کردم ولی فکر میکنم همین طور که شما می فرمایید هست ... چون هر li که میخواد نشون بده میاد اول ... این رو از کجا باید تغییر داد ؟؟ من کد دیگه ای ندارم !!
فکر کنم خود همین تابع جی کوئری این کار رو میکنه
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
کسی می تونه راهنمایی کنه؟؟ هنوز منتظرم !!
پاسخ : درخواست کمک: دکمه Arrow برای اسلایدر
به این یه نگاهی کنید ببتید به دردتون می خوره یا نه ؟!
http://up.vbiran.ir/uploads/26084146...show-ms313.zip