[Løst] animate jQuery hastighet og "delay".

[erolha]

Etter å ha fått et perfekt svar fra @Matsemann på mitt spørsmål vedrørende dette scriptet

//run instantly and then goes after (setTimeout interval)

$("#rulle").animate({ scrollTop: $("#rulle")[0].scrollHeight }, 20000);

setTimeout(function() {
	$("#rulle").animate({scrollTop:0}, 1000); 
},10000);

setInterval(function(){
	// 4000 - it will take 4 secound in total from the top of the page to the bottom
	$("#rulle").animate({ scrollTop: $("#rulle")[0].scrollHeight }, 20000);
	setTimeout(function() {
		$("#rulle").animate({scrollTop:0}, 1000); 
	},10000);

},20000);  

i denne tråden: https://www.diskusjon.no/index.php?showtopic=1686681

(Løsningen til @Matsemann ble presentert på http://jsfiddle.net/NaP8D/425/ )

 

sitter jeg nå med to nye "kan ingenting"-spørsmål:

1. Det virker som scrollingen aksellererer. Er det noen måte å få scriptet til å generere samme hastighet gjennom hele scrollingen?
2. Hvordan får jeg det til å vente x antall sekunder på toppen før det starter scrollingen?

Surrealistisk nok klarer jeg å utvikle nettsider i php, men javascript har jeg altså aldri fått taket på...

 

Igjen, på forhånd takk for alle svar!

[etse]

Du kan bruke "easing" til å bestemme hvordan scrollingen skal skje. Default er linear, som er en konstant hastighet. Du kan f.eks. prøve ut:

 

$("#rulle").animate({scrollTop:0}, 1000, {easing: 'easeInOutQuint'});

 

krever easing-plugin: http://gsgd.co.uk/sandbox/jquery/easing/

Endret 26. september 2015 av etse

[erolha]

Du kan bruke "easing" til å bestemme hvordan scrollingen skal skje. Default er linear, som er en konstant hastighet. Du kan f.eks. prøve ut:

 

$("#rulle").animate({scrollTop:0}, 1000, {easing: 'easeInOutQuint'});

 

krever easing-plugin: http://gsgd.co.uk/sandbox/jquery/easing/

Hei etse, tusen takk for svar!

 

Nå har jeg sett lenge og vel på forslaget ditt, men er ikke kar om å klare å få det til å gjøre noen forskjell. Dette er som tidligere nevnt fordi jeg virkelig ikke forstår (mekanismene i) javascript.

 

Jeg har forsøkt å legge til linjen din til scriptet, og jeg har forsøkt å erstatte

$("#rulle").animate({ scrollTop: $("#rulle")[0].scrollHeight }, 20000);

med linjen din.

 

Tør jeg spørre om ytterligere forklaring?

 

Jeg klarte heller ikke, utfra hva jeg leste på gsgd.co.uk å se at dette venter x tid før det begynner scrollingen. Er det korrekt observert?

[erolha]

Jeg har nå kommet frem til denne:

$("#rulle").animate({ scrollTop: $("#rulle")[0].scrollHeight }, 20000,"linear");

(Jeg la bare til "linear" som løste akserellasjonsproblemet. Default i jQuery var "swing".)

 

Det neste jeg er på jakt etter er 

.delay( 3000 )

som jeg mistenker jeg kan putte et eller annet sted inn i linjen over. Alle mine forsøk har imidlertid feilet. Kan noen fortelle meg hvor jeg skal plassere det? 

 

Tusen takk!

[erolha]

Jeg fant ut av det!

Dette venter 15 sekunder før det kjører, og ruller i samme hastighet hele veien:

$("#rulle").delay( 15000 ).animate({ scrollTop: $("#rulle")[0].scrollHeight }, 30000, "linear");

Takk for hjelpen!