Please take a look on my code...

Hi mate,

I got a function for my website...here it is-


(function($) {

$.fn.easySlider = function(options){

// default configuration properties
var defaults = {
prevId: 'prevBtn',
prevText: '',
nextId: 'nextBtn',
nextText: '',
controlsShow: true,
controlsBefore: '',
controlsAfter: '',
controlsFade: true,
firstId: 'firstBtn',
firstText: 'First',
firstShow: false,
lastId: 'lastBtn',
lastText: 'Last',
lastShow: false,
vertical: false,
speed: 1000,
auto: false,
pause: 2500,
continuous: false
};

var options = $.extend(defaults, options);

this.each(function() {
var obj = $(this);
var s = $("li", obj).length;
var w = $("li", obj).width();
var h = $("li", obj).height();
obj.width(w);
obj.height(h);
obj.css("overflow","hidden");
var ts = s-1;
var t = 0;
$("ul", obj).css('width',s*w);
if(!options.vertical) $("li", obj).css('float','left');

if(options.controlsShow){
var html = options.controlsBefore;
if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';
html += options.controlsAfter;
$(obj).after(html);
};

$("a","#"+options.nextId).click(function(){
animate("next",true);
});
$("a","#"+options.prevId).click(function(){
animate("prev",true);
});
$("a","#"+options.firstId).click(function(){
animate("first",true);
});
$("a","#"+options.lastId).click(function(){
animate("last",true);
});

function animate(dir,clicked){
var ot = t;
switch(dir){
case "next":
t = (ot>=ts) ? (options.continuous ? 0 : ts) : t+1;
break;
case "prev":
t = (t<=0) ? (options.continuous ? ts : 0) : t-1;
break;
case "first":
t = 0;
break;
case "last":
t = ts;
break;
default:
break;
};

var diff = Math.abs(ot-t);
var speed = diff*options.speed;
if(!options.vertical) {
p = (t*w*-1);
$("ul",obj).animate(
{ marginLeft: p },
speed
);
} else {
p = (t*h*-1);
$("ul",obj).animate(
{ marginTop: p },
speed
);
};

if(!options.continuous && options.controlsFade){
if(t==ts){
$("a","#"+options.nextId).hide();
$("a","#"+options.lastId).hide();
} else {
$("a","#"+options.nextId).show();
$("a","#"+options.lastId).show();
};
if(t==0){
$("a","#"+options.prevId).hide();
$("a","#"+options.firstId).hide();
} else {
$("a","#"+options.prevId).show();
$("a","#"+options.firstId).show();
};
};

if(clicked) clearTimeout(timeout);
if(options.auto && dir=="next" && !clicked){;
timeout = setTimeout(function(){
animate("next",false);
},diff*options.speed+options.pause);
};

};
// init
var timeout;
if(options.auto){;
timeout = setTimeout(function(){
animate("next",false);
},options.pause);
};

if(!options.continuous && options.controlsFade){
$("a","#"+options.prevId).hide();
$("a","#"+options.firstId).hide();
};

});

};

})(jQuery);



It's working perfectly...but I need to change little thing...I need it will scroll continuous. Now, when it gets to the end it just starts at the first one without going backwards...

Please help me to fix the issue...

I look forward to hearing from you...

thanks,

 

There are lots of ppl living here in dp but no one interested to help me!

Ok...no problem.

PLEASE CLOSE THIS THREAD. Requesting to dp.

thanks,

 

Did you try changing auto property to true?

vertical: false,
speed: 1000,
[COLOR="red"]auto: true[/COLOR],
pause: 2500,
continuous: false

Code (markup):

 

Yup...but not working

 

I just realized that you are using an older version of EasySlider. They have a new version (1.7):
http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider

If you want to avoid modifying the script itself, add this to your page and change the selector:

<script type="text/javascript">
$(document).ready(function(){	
	$("#slider").easySlider({
		auto: true,
		continuous: true 
	});
});
</script>

Code (markup):

Hope it works now

 

Yes I am using an older version and already I have this code in my page-


<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/easySlider1.5.js"></script>
<script type="text/javascript" charset="utf-8">
// <![CDATA[
$(document).ready(function(){
$("#slider").easySlider({
controlsBefore: '<p id="controls">',
controlsAfter: '</p>',
auto: true,
continuous: true
});
});
// ]]>
</script>


anyways, I am going to download a new version and let's try...

 

1.7 is really working...that mean, I got the solution...thanks a lot

 

Cool I was too lazy to try it myself so thanks for clearing that up