hi, i just wondered if there was a way (like there is in firefox) using javascript to allow a user using IE to drag a hyperlink (without highlighting it) and if dragged over a textarea that the text of the hyperlink (or text of your choosing) is pasted into the textarea at the very beginning? ive seen many examples that allow you to drag and move images around a page but nothing that allows text to be effectively copied and pasted into a textarea once dragged over the textarea whilst the link text remains where it is (not moved from where it was like with the image examples of a drag and drop). Thanks.
7  3255 
yes there is but it would take a bit of code http://dunnbypaul.net/js_mouse/
for mouse events
then when your mouse lets go over the textarea change its value.
A lot of code even for a simple thing like copying and pasting the text of a hyperlink once dragged over a textarea? The link to the example given seems a lot more complicated than I wish to do. I guess I'm on a bit of a downwards slope? Thank-you for your reply.
 -
<script>
-
var mousex = 0;
-
var mousey = 0;
-
var grabx = 0;
-
var graby = 0;
-
var orix = 0;
-
var oriy = 0;
-
var elex = 0;
-
var eley = 0;
-
var algor = 0;
-
var newele;
-
var dropped = false;
-
var dragobj = null;
-
function falsefunc() { return false; }
-
function init()
-
{
-
document.onmousemove = update;
-
update();
-
}
-
function getMouseXY(e) // works on IE6,FF,Moz,Opera7
-
{
-
if (!e) e = window.event; // works on IE, but not NS (we rely on NS passing us the event)
-
if (e)
-
{
-
if (e.pageX || e.pageY)
-
{ // this doesn't work on IE6!! (works on FF,Moz,Opera7)
-
mousex = e.pageX;
-
mousey = e.pageY;
-
algor = '[e.pageX]';
-
if (e.clientX || e.clientY) algor += ' [e.clientX] '
-
}
-
else if (e.clientX || e.clientY)
-
{ // works on IE6,FF,Moz,Opera7
-
mousex = e.clientX + document.body.scrollLeft;
-
mousey = e.clientY + document.body.scrollTop;
-
algor = '[e.clientX]';
-
if (e.pageX || e.pageY) algor += ' [e.pageX] '
-
}
-
}
-
}
-
function update(e)
-
{
-
getMouseXY(e); // NS is passing (event), while IE is passing (null)
-
}
-
function grab(context)
-
{
-
document.onmousedown = falsefunc;
-
var newele = document.createElement("div");
-
newele.style.position = "absolute";
-
newele.style.opacity = '.'+50;
-
newele.style.filter = "alpha(opacity:50)";
-
newele.style.visibility="hidden";
-
newele.innerHTML = context.innerHTML;
-
dragobj = newele;
-
dragobj.style.zIndex = 10; // move it to the top
-
document.getElementsByTagName('body')[0].appendChild(newele);
-
document.onmousemove = drag;
-
document.onmouseup = drop;
-
dropped = false;
-
grabx = mousex;
-
graby = mousey;
-
elex = orix = context.offsetLeft;
-
eley = oriy = context.offsetTop;
-
update();
-
}
-
function drag(e)
-
{
-
if (dragobj)
-
{
-
dragobj.style.visibility="visible";
-
elex = orix + (mousex-grabx);
-
eley = oriy + (mousey-graby);
-
dragobj.style.position = "absolute";
-
dragobj.style.left = (elex).toString(10) + 'px';
-
dragobj.style.top = (eley).toString(10) + 'px';
-
dropped = false;
-
}
-
update(e);
-
return false; // in IE this prevents cascading of events, thus text selection is disabled
-
}
-
function drop() {
-
if (dragobj)
-
{
-
dragobj.style.zIndex = 0;
-
dragobj.style.display='none';
-
dragobj.style.visibility='hidden';
-
dropped = true;
-
}
-
update();
-
document.onmousemove = update;
-
document.onmouseup = null;
-
document.onmousedown = null;
-
}
-
function checkdrop(dropinto) {
-
if (dragobj && dropped) {
-
dropinto.value = dropinto.value + dragobj.innerHTML;
-
dropped = false;
-
}
-
}
-
</script>
-
<html>
-
<body>
-
<div id="link1" onmousedown="grab(this)"><A href="http://www.google.com">Drag me</a></div>
-
<textarea id="textarea" onmouseover="checkdrop(this)" rows=20 cols=30></textarea>
-
</body>
-
</html>
-
I made up this little code messing around with it...
I don't like giving away scripts without you working for it but this one was kind of challenging :P i didn't give it all away! give this a test and play around with it.
Amazing thanks alot! Ive put it into my own page which has numerous other bits of JS so Ive noticed a few bugs. For some reason when I hold my mouse down and begin dragging a link instead of the opaque link that follows the mouse being just besides the mouse cursor it's miles up the page (this changes so sometimes its close enough to allow me to drop it in the textarea) but then if I do manage that it doesn't paste it again til I move my mouse over the textarea but that won't be a problem if I can sort the latter. Also if you drag and drop the link somewhere that isn't on the textarea but then mouseover the textarea (with no mousedown as you have already dropped the link) it pastes the link anyway. I also get an error that says "undefined is null or not at object" when I load the page which is annoying! Thanks again.
The problem with having an opaque copy of the link following the mouse whilst I also have a JS tooltip which follows the mouse whenever you are onmouseover of a hyperlink is they are interfering with each other. The JS tooltip isn't disabled till onmouseout and as this hasn't occured when onmousedown occurs there is already a <div></div> present (the JS tooltip) thus the opaque copy is miles up the page - I think that's the problem anyway! Works fine if I get rid of the JS tooltip but I kinda need it.
<div id="overDiv" style="position: absolute;"></div>
<a href="#" onmouseover="return overlib('tooltip');" onmouseout="return nd();" onmousedown="grab(this);">link</a>
Is there anyway of changing it so that it doesn't use an opaque copy (although a great idea) but instead uses the mouse cursor so that when the textarea is on focus it pastes? I guess it was easier to create the <div></div> and paste the text it contained. I'm not sure how to get this to work with my current JS. *hmmm*
Is there no way of capturing, say for example, a hyperlinks onmousedrag event in the same way you can capture its onmouseover event? That way I could just use onmousedrag i.e. mouse button held down and mouse then moved to fire a function? Your script is perfect if I didnt already have existing JS doing other things but I do. I'm open to suggestions but every other mouse event, I think, already does something -> onclick, ondblclick, onmousedown and onmouseup are taken up as the thing in question is a hyperlink, onmouseover and onmouseout are used by the JS tooltip plus there's no action involved and onmousemove well that would just be silly. I thought onmousedrag would be the answer! How can such a simple issue turn into something this chaotic? Thanks for moderator + anyone elses help.
no you can't capture on drag.
Sign in to post your reply or Sign up for a free account.
Similar topics
by: John Guarnieri |
last post by:
Hi All,
I need some code to drag items in a list box either up or down along with
not just the text but with the itemdata too.
Can anyone hook me up?
TIA John
|
by: Doug van Vianen |
last post by:
Hi,
I am working on an Applet which provides some mouse practice for
new computer users in our local seniors' computer club. The applet
contains several cards, in a card layout, which are...
|
by: yawnmoth |
last post by:
say i have a form where, if a user clicks in it, all the text is
highlighted, and where, if a user clicks on a button outside of the
form, a certain text string is inserted where the cursor in the...
|
by: Wang, Jay |
last post by:
Hello, all,
I would like to enable some text between <SPAN
url="http://www.testserver.com/">WORD TO BE DRAGGED </SPAN>. I put some
javascript and it will extract http://www.testserver.com/ from...
|
by: yawnmoth |
last post by:
say i have a form where, if a user clicks in it, all the text is
highlighted, and where, if a user clicks on a button outside of the
form, a certain text string is inserted where the cursor in the...
|
by: Seth Russell |
last post by:
I'm running Kevin Roth's rte box and i want to deactivate the ability
to past inside the box. People sometimes paste outrageous things in
there that might break my site. How can I deactivate the...
|
by: Nic |
last post by:
Hi - I am battling to find the a resource, so maybe some one in here can
help
The problem is as follows: I am trying to build a mod_perl source code
editor for the web - to edit Perl source code...
|
by: Fred R |
last post by:
I'm designing an app in Access 97 that will facilitate the uploading
of records and images to a website. The user selects the image
thumbnails from the file system and drags them into the app....
|
by: XJ |
last post by:
Hi experts,
i need to know who have some knowledge to create the
function for cut , copy and paste for an object , for instance, i
create a page for some configuration which contain as email text...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
| |
