So the mouse trailer works until I pop in a doctype declaration (need it for my Jquery scripts to work in IE).
Here's the source ([url]http://www.javascript-fx.com/mouse_trail/fading/demo3.html[/url])
Here's what I'm working with:
[b]index.html[/b]
[code]
<!doctype HTML>
<html>
<head>
<SCRIPT LANGUAGE="JavaScript" SRC="javascript/JSFX_Layer.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="javascript/JSFX_Mouse.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="javascript/JSFX_FadingTrail.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
// Mouse Trails
function JSFX_StartEffects()
{
JSFX.FadingTrail(62, '000000', '0189E4', 2);
}
</SCRIPT>
</head>
<BODY onLoad="JSFX_StartEffects()">
</BODY>
</html>[/code]
And here's the js scripts, there's 3 other files in combo with this, but this is the primary
[b]JSFX_FadingTrails.js[/b]
[code]var hexDigit=new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
function dec2hex(dec)
{
return(hexDigit[dec>>4]+hexDigit[dec&15]);
}
function hex2dec(hex)
{
return(parseInt(hex,16))
}
/*
* Static Class FadingTrail
*/
JSFX.FadingTrail = function(w, startColor, endColor, type)
{
return new JSFX.FadingTrailControler(w, startColor, endColor, type);
}
/*
* Class FadingTrailControler extends Object
*/
JSFX.FadingTrailControler = function(w, startColor, endColor, type)
{
if(type == null)
type = 0;
var i;
var max = w;
this.sprites=new Array();
this.w = w;
this.lastX = 0;
this.lastY = 0;
this.id = "JSFX_FadingTrailControler_"+JSFX.FadingTrailControler.count++;
for(i=0 ; i<max ; i++)
this.sprites[this.sprites.length] = new JSFX.FadingTrailSprite(w, startColor, endColor, type);
if(type==1)
this.animate = this.animate2;
else if(type==2)
this.animate = this.animate3;
else if(type==3)
this.animate = this.animate3;
else
this.animate = this.animate1;
window[this.id]=this;
this.animate();
}
JSFX.FadingTrailControler.count = 0;
JSFX.FadingTrailControler.prototype.animate1 = function()
{
setTimeout("window."+this.id+".animate1()", 0);
var mx = JSFX.Browser.mouseX;
var my = JSFX.Browser.mouseY;
var i;
if(this.lastX != mx || this.lastY != my)
{
this.lastX=mx;
this.lastY=my;
for(i=0; i<this.sprites.length ; i++)
{
if(this.sprites[i].i == 0)
{
this.sprites[i].i=Math.floor(this.sprites[i].w/2);
this.sprites[i].moveTo(mx, my);
this.sprites[i].setzIndex(0);
this.sprites[i].show();
break;
}
}
}
for(i=0; i<this.sprites.length ; i++)
this.sprites[i].animate();
}
JSFX.FadingTrailControler.prototype.animate2 = function()
{
setTimeout("window."+this.id+".animate2()", 40);
var mx = JSFX.Browser.mouseX;
var my = JSFX.Browser.mouseY;
var i;
for(i=0; i<this.sprites.length ; i++)
{
if(this.sprites[i].i == 0)
{
this.sprites[i].i=Math.floor(this.sprites[i].w/2);
this.sprites[i].moveTo(mx, my);
this.sprites[i].setzIndex(0);
this.sprites[i].show();
break;
}
}
for(i=0; i<this.sprites.length ; i++)
this.sprites[i].animate();
}
JSFX.FadingTrailControler.prototype.animate3 = function()
{
setTimeout("window."+this.id+".animate3()", 40);
var mx = Math.floor(JSFX.Browser.mouseX/this.w);
var my = Math.floor(JSFX.Browser.mouseY/this.w);
var i;
if(this.lastX != mx || this.lastY != my)
{
this.lastX=mx;
this.lastY=my;
for(i=0; i<this.sprites.length ; i++)
{
if(this.sprites[i].i == 0)
{
this.sprites[i].i=this.sprites[i].s;
this.sprites[i].moveTo(mx*this.w, my*this.w);
this.sprites[i].show();
break;
}
}
}
for(i=0; i<this.sprites.length ; i++)
this.sprites[i].animate();
}
/*
* Class FadingTrailSprite extends Layer
*/
JSFX.FadingTrailSprite = function(w, startColor, endColor, type)
{
this.superC = JSFX.Layer;
this.superC(" ");
this.x = 0;
this.y = 0;
this.i = 0;
this.w = w;
if(type==3)
this.s = w;
else
this.s = w/2;
this.r1 = hex2dec(startColor.slice(0,2));
this.g1 = hex2dec(startColor.slice(2,4));
this.b1 = hex2dec(startColor.slice(4,6));
this.r2 = hex2dec(endColor.slice(0,2));
this.g2 = hex2dec(endColor.slice(2,4));
this.b2 = hex2dec(endColor.slice(4,6));
this.setBgColor('#' + startColor);
this.resizeTo(this.w, this.w);
this.moveTo(this.x, this.y);
this.show();
if(type==3)
this.animate = this.animate2;
else
{
this.clip(0,0,0,0);
this.animate = this.animate1;
}
}
JSFX.FadingTrailSprite.prototype = new JSFX.Layer;
JSFX.FadingTrailSprite.prototype.setColor = function()
{
var i = this.s-this.i;
var r2= Math.floor(this.r1+(i*(this.r2-this.r1))/(this.s) + .5);
var g2= Math.floor(this.g1+(i*(this.g2-this.g1))/(this.s) + .5);
var b2= Math.floor(this.b1+(i*(this.b2-this.b1))/(this.s) + .5);
this.setBgColor("#" + dec2hex(r2) + dec2hex(g2) + dec2hex(b2));
}
JSFX.FadingTrailSprite.prototype.animate1 = function()
{
if(this.i > 0)
{
this.i--;
this.setColor();
var w = (this.s)-this.i;
this.setzIndex(w);
this.clip(w, w, this.w-w, this.w-w);
}
}
JSFX.FadingTrailSprite.prototype.animate2 = function()
{
if(this.i > 0)
{
this.i--;
this.setzIndex(this.i);
this.setColor();
}
else
this.hide();
}[/code]
A mouse trail? Sure is 1998 in here.
Why do you have some tags in caps but not others and why do you specify a language attribute? Do you have any output in the JS console?
<!DOCTYPE html> would mean HTML5, the only attribute you need for a <script> is src if you are loading from an external file, but I would specify type="text/javascript" in case some older IE versions get confused by it.
[QUOTE=SteveUK;39709183]
<!DOCTYPE html> would mean HTML5, the only attribute you need for a <script> is src if you are loading from an external file, but I would specify type="text/javascript" in case some older IE versions get confused by it.[/QUOTE]
I've had chrome refuse to load js without specifying type='text/javascript' before, it's not just for shitty browsers.
[QUOTE=Catdaemon;39710724]I've had chrome refuse to load js without specifying type='text/javascript' before, it's not just for shitty browsers.[/QUOTE]
Was it inline js or an external file? IIRC it is trying push away the whole inline JS by not allowing them in their extensions for example.
[QUOTE=commander204;39726117]Was it inline js or an external file? IIRC it is trying push away the whole inline JS by not allowing them in their extensions for example.[/QUOTE]
If that is the case it makes sense, if the type attribute is missing in a <script> tag then there's no mime type for the browser to determine how to run the code, it might think you're trying to use vbscript.
Interestingly the [url=http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#the-script-element]current draft[/url] of the HTML5 specification says that if the type (or language) attribute is missing then assume "text/javascript", so that is how chrome [i]should[/i] be behaving.
Sorry, you need to Log In to post a reply to this thread.
