Log in

View Full Version : Adding mouse trailer in cs4


minorpa
11-16-2010, 01:49 AM
How do you add a mouse trailer in Flash CS4?
minorpa
11-16-2010, 02:18 PM
The code works but it displays in the background. Here's my code below.


<html>
<head>
<title>Mouse Test Trailer</title>
<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Verdana;
font-weight:bold;
color:black;
}
</style>
<script>

/*
Cursor Trailor Text
*/

var x,y
var step=20
var flag=0

// Your message. Important: the space at the end of the sentence!!!
var message="Indian Queen Elementary School! "
message=message.split("")

var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
}

function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
flag=1
}

function makesnake() {
if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]
}
}

else if (flag==1 && document.layers) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]
}
}
var timer=setTimeout("makesnake()",30)
}

</script>
</head>
<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll">
<script>
<!-- Beginning of JavaScript -

for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"' class='spanstyle'>")
document.write(message[i])
document.write("</span>")
}

if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

// - End of JavaScript - -->
</script>
</body>
</html>

The rest of the html file loads a Flash movie and when you move the mouse you can only see it behind the flash movie.

Thank you
jscheuer1
11-16-2010, 04:09 PM
Follow the below advice, it's the best you can do without recompiling the .swf, which is usually not required. But be aware that when the mouse is over the Flash object, the Flash object may still take control of the mouse cursor. But at least when the mouse isn't over the Flash object, the trailer effect should show over the Flash object. Some Flash objects will not even allow this, but most do.

Loosely from:

http://www.macromedia.com/cfusion/knowledgebase/index.cfm?id=tn_14201

Add in this language to your object/embed tag(s) -

Add the following parameter to the OBJECT tag:


<param name="wmode" value="transparent">

Add the following attribute to the EMBED tag:


wmode="transparent"

Or, if you are using two object tags, as can and is sometimes done, add the param tag to both of them.

If you are using script to generate the tags, the wmode transparent must be passed to the script. This is easily accomplished but, varies depending upon the sort of script one uses. Some scripts do it automatically.
minorpa
11-16-2010, 10:58 PM
Thank you for your response, however the trailer is still being displayed behind the flash object.
jscheuer1
11-17-2010, 03:47 AM
Please post a link to a page on your site that contains the problematic code so we can check it out.
minorpa
11-17-2010, 06:19 PM
Here's the link

"http://www.soaring-technologies.com/indianqueen/test6.html"
jscheuer1
11-17-2010, 06:35 PM
Change this (highlighted as shown):


<script language="JavaScript" type="text/javascript">
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0',
'width', '850',
'height', '1200',
'src', 'iqes',
'quality', 'high',
'pluginspage', 'http://www.adobe.com/go/getflashplayer',
'align', 'middle',
'play', 'true',
'loop', 'true',
'scale', 'showall',
'wmode', 'transparent',
'devicefont', 'false',
'id', 'iqes',
'bgcolor', '#ffffff',
'name', 'iqes',
'menu', 'true',
'allowFullScreen', 'false',
'allowScriptAccess','sameDomain',
'movie', 'iqes',
'salign', ''
); //end AC code
</script>

Oh, and if you want this to work in other browsers besides IE, use this version of the trailer script:


<script>

/*
Cursor Trailor Text
*/

var x,y
var step=20
var flag=0

// Your message. Important: the space at the end of the sentence!!!
var message="Indian Queen Elementary School! "
message=message.split("")

var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
}

function handlerMM(e){
e = e || event;
x = typeof e.pageX === 'number'? e.pageX : document.body.scrollLeft+event.clientX
y = typeof e.pageY === 'number'? e.pageY : document.body.scrollTop+event.clientY
flag=1
}

function makesnake() {
if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]
}
}

else if (flag==1 && document.layers) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]
}
}

else if (flag==1 && document.getElementById) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
var thisspan = document.getElementById('span' + i).style;
thisspan.left=xpos[i]+'px';
thisspan.top=ypos[i]+'px'
}
}
var timer=setTimeout("makesnake()",30)
}

</script>
minorpa
11-17-2010, 06:58 PM
When I change wmode to "transparent" the only thing you see is the mouse trailer and nothing else.
jscheuer1
11-17-2010, 07:29 PM
Works fine here:

http://home.comcast.net/~jscheuer1/side/flash_2_h.htm
minorpa
11-17-2010, 08:42 PM
I'm not sure what's going on but it's still not working. When I move the mouse over the flash object the object begins to wipe itself out. Do you have any links on creating text mouse trailer inside of Flash?
jscheuer1
11-18-2010, 12:17 AM
Are you talking about my example:

http://home.comcast.net/~jscheuer1/side/flash_2_h.htm

which works fine as far as I can tell, or the one you're working with?

Because your example:


http://www.soaring-technologies.com/indianqueen/test6.html

still has the old code.
minorpa
11-18-2010, 12:32 AM
yes i'm referring to your link
jscheuer1
11-18-2010, 01:12 AM
Hmm, as I say, works fine here. What wipes itself out? The flash or the cursor? The cursor is supposed to fall apart as it's moved around and reassemble when the mouse comes to rest.

But you may be better off with something entirely Flash based.

For that you would need to rewrite and recompile the Flash from its source Action Script. As to how exactly to do that - I haven't a clue. I thought you wanted help with the javascript, sorry.
minorpa
11-19-2010, 01:12 AM
My original code includes the javascript in the html file, however when I load the page the trailer is display behind the flash object. What I'm trying to accomplish should be done inside of flash.
jscheuer1
12-13-2010, 03:59 AM
My original code includes the javascript in the html file, however when I load the page the trailer is display behind the flash object. What I'm trying to accomplish should be done inside of flash.

Then start a new thread if you haven't already and specifically ask for help with coding it in action script, not javascript.

Sorry I misunderstood your request.