leaving a shaddow / image trail with a tooltip

E

Eadmund

Hi all,

Odd question / problem: I'm using a tooltip fom the "Dynamic Drive
DHTML code library (www.dynamicdrive.com) - v-cool" - (snipits that are
relevant trimed for readability and included below). I want to be able
to drag the tooltip image (this is working fine) BUT leave a copy
behind as I drag.

ie. if you drag slowly, you just get a solid tooltip sized line behind
the object. Any idea how this can be achieved?

Regards

Eadmund


##### the javascript bit ###

if (enabletip){
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;

//position the horizontal position of the menu where the mouse is
positioned
tipobj.style.left=curX+offsetxpoint+"px";

tipobj.style.top=curY+offsetypoint+"px";
tipobj.style.visibility="visible";
}

## the bitthat calls it in HTML body ####
<script type="text/javascript">
if (ie||ns6) var tipobj=document.all? document.all["dhtmltooltip"] :
document.getElementById? document.getElementById("dhtmltooltip") : "";
document.onmousemove=positiontip;

</script>
 
F

Fred

Hi all,

Odd question / problem: I'm using a tooltip fom the "Dynamic Drive
DHTML code library (www.dynamicdrive.com) - v-cool" - (snipits that are
relevant trimed for readability and included below). I want to be able
to drag the tooltip image (this is working fine) BUT leave a copy
behind as I drag.

ie. if you drag slowly, you just get a solid tooltip sized line behind
the object. Any idea how this can be achieved?

Use setTimeout to repeatedly call a function that leaves clones of your
drag image behind. Once you've created a max of say 6 or 8, move the
last one to the current position. Keep increasing the zIndex by 1 so
they stack properly. Once you stop dragging, the function removes the
images until none are left.

Use such effects sparingly, the "ooh ahh" factor is usually very
short-lived. Unless it actually improves the functionality of the
site, most visitors will find them annoying after a few moments. You
might like to provide an option to turn the effect off and see how many
users take advantage of it.


[...]
##### the javascript bit ###

if (enabletip){
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;

Replace the browser sniffing junk with feature detection. Do you
really want this to work *only* in IE and Navigator 6? In cases like
this, it is best to do the feature detection up-front and create a
'cursorPosition' function based on the result. That way you do it just
once and everything runs that little bit more smoothly.
 
E

Eadmund

Fred said:
Hi all,

Odd question / problem: I'm using a tooltip fom the "Dynamic Drive
DHTML code library (www.dynamicdrive.com) - v-cool" - (snipits that are
relevant trimed for readability and included below). I want to be able
to drag the tooltip image (this is working fine) BUT leave a copy
behind as I drag.

ie. if you drag slowly, you just get a solid tooltip sized line behind
the object. Any idea how this can be achieved?

Use setTimeout to repeatedly call a function that leaves clones of your
drag image behind. Once you've created a max of say 6 or 8, move the
last one to the current position. Keep increasing the zIndex by 1 so
they stack properly. Once you stop dragging, the function removes the
images until none are left.

Use such effects sparingly, the "ooh ahh" factor is usually very
short-lived. Unless it actually improves the functionality of the
site, most visitors will find them annoying after a few moments. You
might like to provide an option to turn the effect off and see how many
users take advantage of it.


[...]
##### the javascript bit ###

if (enabletip){
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;

Replace the browser sniffing junk with feature detection. Do you
really want this to work *only* in IE and Navigator 6? In cases like
this, it is best to do the feature detection up-front and create a
'cursorPosition' function based on the result. That way you do it just
once and everything runs that little bit more smoothly.

Thanks for the quick turn arond Fred. I'd actually got somewhere with
clone object to achieve the same effect. What I'm actually doing here
is not a drag effect, but an attempt at a simple get-around to the lack
of canvas in IE

I am trying to capture a users signature (not digital, but as in
signarture at bottom of letter - From Joe Blogs (UK) / John Doe(US) ).
By dragging an image that is only a few pixels square and leaving a
trail, I can let the user "sign" in a box, using a mouse as a pen, and
capture the series of x-y positions that make up the line.

The next step would be to get that in to an image format!! How I dothat
I' hav'nt started thinging about yet, but I'll probably do it in perl
back on the server, as I bet javascript does not have the
functionality.

Thnaks again,

Eadmund
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top