Interval issue

[NubPro]

http://jsfiddle.net/G6ba6/

First of all, yes I'm terribly bad at Javascript.

I don't understand why, when I hover on the objects, it stops and yes that's how it should work. Now move your cursor away, then move it back and point those objects again. It doesn't work right? I'm not sure why Interval works anymore. No luck fixing this
I also notice a bug that the slider goes insanely speedy when you on hover all of them.
Do wish somebody would help me out this time, again....please

source:
https://code.google.com/p/jquery-infinite-carousel/

 

[TimeBomb]

Your code is setting more than one interval of the slide function; see line 15. You could, perhaps, clear the intervalId and then set it back to that interval. e.g. http://jsfiddle.net/G6ba6/3/
Or, instead of unnecessarily messing around with the interval, why not try controlling the interval function? e.g. http://jsfiddle.net/G6ba6/2/

 

[jMerliN]

http://jsfiddle.net/G6ba6/4/

 

[NubPro]

Your code is setting more than one interval of the slide function; see line 15. You could, perhaps, clear the intervalId and then set it back to that interval. e.g. http://jsfiddle.net/G6ba6/3/
Or, instead of unnecessarily messing around with the interval, why not try controlling the interval function? e.g. http://jsfiddle.net/G6ba6/2/

Thanks man!
I understood a little bit more now
jMerliN appreciate dat...I'm dumb ;/

Can anybody explain this line?

if(event.originalEvent){

 

[bialy90722]

On line 8 you have created a variable and give a Interval into it. So in order to stop a Interval you need clear the interval from that variable. And then set to the same variable the interval on mouseout.

In order to prevent this occurrences where interval is setting an again, and again when you mouseout. You simply need to work with the same variable.

http://jsfiddle.net/G6ba6/4/ -> And that example is an appropriate example. A checks if is hovered or anything, will work too, but it may go too much complicated when facing 800 lines of code on your app.


And!

if(event.originalEvent){

That line I suppose that the hover event prevents to be doubled. But never have seen that before in actual use.

You are using a Javascript library called jQuery, which is where the $() function comes from. jQuery wraps several parts of Javascript to make it easier to use. One of those parts is event handing. In your example, because you're using jQuery to bind to the paste event, the object passed to your callback (e) is a jQuery event object, not a built-in Javascript event object. The jQuery event object exposes the originalEvent property to give you access to the underlying built-in event object.

In your example you need to get hold of the clipboard data, which isn't available through the jQuery event object so you need to access the original event object to get at it.

http://stackoverflow.com/questions/19617902/understanding-javascript-originalevent

BTW. Use stackoverflow a lot, it helps.

 

[NubPro]

Thanks guys



but this script is no longer supported with the latest jQuery anymore, since 1.8+ version.
'-' only hope if somebody can bother to update the script ><

http://blog.jquery.com/2012/08/09/jquery-1-8-released/

 

[Komakech]

Thanks guys



but this script is no longer supported with the latest jQuery anymore, since 1.8+ version.
'-' only hope if somebody can bother to update the script ><

http://blog.jquery.com/2012/08/09/jquery-1-8-released/

Wat. 1.8 was released in 2012, it even says in the link you provided..

Posted on August 9, 2012 by dmethvin

You should always use the latest version because it supports old browsers and new browsers.. Anyway we are on 1.10 now, use that...

 

[NubPro]

Wat. 1.8 was released in 2012, it even says in the link you provided..


You should always use the latest version because it supports old browsers and new browsers.. Anyway we are on 1.10 now, use that...

but this script is no longer supported with the latest jQuery anymore, since 1.8+ version.

re-read. probably bad english.
The latest jQuery core isn't working on this outdated script anymore. It stopped working since jQuery 1.8 version.

 

[Komakech]

re-read. probably bad english.
The latest jQuery core isn't working on this outdated script anymore. It stopped working since jQuery 1.8 version.

Yeah.. Really broken
http://jsfiddle.net/G6ba6/8/

The problem is whoever made the original one was using .outerWidth("true") instead of .outerWidth(true)

Enjoy.

 

[bialy90722]

$(document).ready(function(){
	$('#viewport').carousel('#simplePrevious', '#simpleNext');
	
    function slide(){
        $('#simpleNext').click();
    }

    var intervalId = setInterval(slide, 1000);

    $('#viewport, #simplePrevious, #simpleNext').mouseover(function(){
        clearInterval(intervalId);
    });

    $('#viewport, #simplePrevious, #simpleNext').mouseout(function(){
        intervalId = setInterval(slide, 1000);
    });
});

 

[NubPro]

Yeah.. Really broken
http://jsfiddle.net/G6ba6/8/

The problem is whoever made the original one was using .outerWidth("true") instead of .outerWidth(true)

Enjoy.

hahaha thanks man
you're da best!

 

[Komakech]

hahaha thanks man
you're da best!

I do Javascript all the time as part of my job, just make sure you copy the new Carousel javascript file and save it locally, I regularly clear out my Google Drive.

Here's the raw code -> Carousel.js

 

[NubPro]

I do Javascript all the time as part of my job, just make sure you copy the new Carousel javascript file and save it locally, I regularly clear out my Google Drive.

Here's the raw code -> Carousel.js

"true" to true.
problem solved right?
if so, u may clear the file :d I'd updated the script and it works

thanks again buddy!

 

[NubPro]

@Komakech
how would I make the carousel slide 4 items each time instead 1?
I couldn't read the codes ><

 

[Komakech]

@Komakech
how would I make the carousel slide 4 items each time instead 1?
I couldn't read the codes ><

I can't say I looked that in-depth into the carousel code. I've still got the file on my Google Drive, I'll take a look at it during my lunch break for you.

Edit:

Turns out I had about 10 minutes to spare before a meeting, made a 'quick' build for it. I noticed with 6 elements the carousel had a bug in which it'd show only 5 and 6 before skipping the entire animation and starting at 1 again. Didn't have time to fix it so did a 'quick fix' in which the number of elements in carousel is now 8.

http://jsfiddle.net/G6ba6/9/

I also did some minor CSS edits to fit 4 slides in the viewport instead of 3 and a bit.

I'll take a proper look into it on my lunch break and see if I can hunt down this bug!

 

[NubPro]

I can't say I looked that in-depth into the carousel code. I've still got the file on my Google Drive, I'll take a look at it during my lunch break for you.

Edit:

Turns out I had about 10 minutes to spare before a meeting, made a 'quick' build for it. I noticed with 6 elements the carousel had a bug in which it'd show only 5 and 6 before skipping the entire animation and starting at 1 again. Didn't have time to fix it so did a 'quick fix' in which the number of elements in carousel is now 8.

http://jsfiddle.net/G6ba6/9/

I also did some minor CSS edits to fit 4 slides in the viewport instead of 3 and a bit.

I'll take a proper look into it on my lunch break and see if I can hunt down this bug!

aw you broke it
it no longers slides infinitely

 

[Komakech]

aw you broke it
it no longers slides infinitely

It slides infinitely for me as long as you have 8 elements instead of 6. Never got time to fix it yesterday, literally had a 5 minute lunch break. If I get time today I'll look into it.

 

[NubPro]

It slides infinitely for me as long as you have 8 elements instead of 6. Never got time to fix it yesterday, literally had a 5 minute lunch break. If I get time today I'll look into it.

please do sir :'( i can't finish my project without your actual fix for this

 

[Komakech]

please do sir :'( i can't finish my project without your actual fix for this

I spent an hour trying to figure out the best way to do this. Eventually came to the realisation that we need to clone the elements to a common factor of the two variables: Number of elements and Amount shown in viewport.

The end result is this: http://jsfiddle.net/G6ba6/10/

 

[NubPro]

I spent an hour trying to figure out the best way to do this. Eventually came to the realisation that we need to clone the elements to a common factor of the two variables: Number of elements and Amount shown in viewport.

The end result is this: http://jsfiddle.net/G6ba6/10/

why was it a necessary to change this?
1 to 2?
firstElementOnViewPort = 2;

and this
lastPos = 0;


btw, YOU ARE A GENIUS! I LUV YAA!