Box Shadow faden met JavaScript en Jquery.

[Remi1995]

Hallo.


Ik wil graag dat de box shadow van een div in een soort animate steeds groter en kleiner word.

Ik heb hetvolgende gemaakt maar ik krijg het nog niet aan de praat.

[JS]$(document).ready(function(){
function rightboxshadow(x,richting){
$('#rightbox').css('box-shadow','inset -0px 0px ' + x + 'px #A9B8C2');
if(richting == 1){
x = x + 1
}else{
x = x - 1;
}

if(x == 0){
setTimeout(function(){
rightboxshadow(x,'1')
}, 500);
}else{
setTimeout(function(){
rightboxshadow(x,'0')
}, 500);
}
}
setTimeout(rightboxshadow(1,1),500);
});[/JS]

Kan iemand mij misschien verder helpen?



Groetjes, Remi1995.

 

[That Guy]

[JS]setTimeout(rightboxshadow(1,1),500);[/JS]

setTimeout werkt niet zo. Het ziet er zo uit:

[JS]number setTimeout(function, number);[/JS]

waar function een functiereference is, niet een functiecall wat jij geeft.

Zo werkt het wel:

[JS]setTimeout(function()
{
rightboxshadow(1,1);
},500);[/JS]


overigens ben ik bang dat de rechtboxshadow functie alleen in de body's load event beschikbaar is(?).

 

[Remi1995]

Bedankt voor je reactie.

Ik heb het geprobeerd maar krijg de volgende error in Firebug;
"useless setTimeout call (missing quotes around argument?)".



Groetjes, Remi1995.

 

[Remi1995]

Ik heb het toch aan de praat gekregen.
Dit is de code die ik nu heb;
[JS]function rightboxshadow(xx,richting){
var x = xx;
$('#rightbox').css('box-shadow','inset -0px 0px ' + x + 'px #A9B8C2');
if(richting == 1){
x = x + 1
}else{
x = x - 1;
}

var y = 0;
if(x > 25){
setTimeout(function()
{
rightboxshadow(x,0);
},50);
y = 1;
}
if(x == 0){
setTimeout(function()
{
rightboxshadow(x,1);
},50);
y = 1;
}
if(y == 0){
setTimeout(function()
{
rightboxshadow(x,richting);
},50);
}
}
rightboxshadow(1,1);[/JS]

Bedankt voor je hulp.


Groetjes, Remi1995.