sreenath205
May 26th, 2005, 12:46 AM
Hi
My task is that when i do a mouse down on any link in html page and drag it , a copy of the text should move along with the mouse pointer.I have partially achieved this task by using the code below, the code below creates a tool tip i have modified it to suite my needs .The problem is that when i drag the all other text in the page starts getting selected (Default behavior :D ) is there any way to stop that selection or flickering effect :rolleyes:
<html>
<head>
<STYLE>
<!--
#pup {position:absolute; visibility:hidden; z-index:20; width:26; cursor:hand}
.drag{position:absolute;cursor:hand}
-->
</STYLE>
</head>
<body>
<br>
<br>
<div class="drag" id="d1" style="width:100%; text-align:left">
<h1 onmousedown="po()" onClick="kill()" onfocus="this.blur()" >NO LINK, JUST HOVER!</h1></div>
<br>
<div class ="drag" id="d2" style="width:100%; text-align:left">
<h1 onmousedown="po()" onClick="kill()" >sree</h1></div>
<!--
######################################################
# JAVASCRIPT POPUPS ROUTINE VERSION #7 07-Feb-2001 #
# Written by Mike McGrath [mike_mcgrath@lineone.net] #
# PC-Tested for Netscape 3.04, 4.61, 6.0, & IE5.5 #
# Note: Popups may not cover all form field inputs. #
# PLEASE RETAIN THIS NOTICE WHEN COPYING MY SCRIPT. #
# THIS SCRIPT IS COPYRIGHT OF MIKE MCGRATH 1998-2001 #
######################################################
-->
<script type="text/javascript">
<!-- Original: Mike McGrath (mike_mcgrath@lineone.net) -->
<!-- Web Site: http://website.lineone.net/~mike_mcgrath -->
<!--
var Xoffset=-100; // modify these values to ...
var Yoffset= -20; // change the popup position.
var popwidth=200; // popup width
var bcolor="darkgray"; // popup border color
var fcolor="black"; // popup font color
var fface="verdana"; // popup font face
// create content box
document.write("<DIV ID='pup'></DIV>");
// id browsers
var iex=(document.all);
var nav=(document.layers);
var old=(navigator.appName=="Netscape" && !document.layers && !document.getElementById);
var n_6=(window.sidebar);
// assign object
var skin;
if(nav) skin=document.pup;
if(iex) skin=pup.style;
if(n_6) skin=document.getElementById("pup").style;
// park modifier
var yyy=-1000;
// capture pointer
if(nav)document.captureEvents(Event.MOUSEDOWN);
if(n_6) document.addEventListener("mousemove",get_mouse,true);
if(nav||iex)document.onmousemove=get_mouse;
document.onmousedown=get_mouse;
document.onmouseup=kill
document.onmousemove=get_mouse;
// set dynamic coords
function po(){
popup(event.srcElement.innerText,'#FFFFFF');
}
function get_mouse(e)
{
if(event.button==1){
var x,y;
if(nav || n_6) x=e.pageX;
if(iex) x=event.x+document.body.scrollLeft;
if(nav || n_6) y=e.pageY;
if(iex)
{
y=event.y;
if(navigator.appVersion.indexOf("MSIE 4")==-1)
y+=document.body.scrollTop;
}
if(iex || nav)
{
skin.top=y+yyy;
skin.left=x+Xoffset;
}
if(n_6)
{
skin.top=(y+yyy)+"px";
skin.left=x+Xoffset+"px";
}
nudge(x);
}
}
// avoid edge overflow
function nudge(x)
{
var extreme,overflow,temp;
// right
if(iex) extreme=(document.body.clientWidth-popwidth);
if(n_6 || nav) extreme=(window.innerWidth-popwidth);
if(parseInt(skin.left)>extreme)
{
overflow=parseInt(skin.left)-extreme;
temp=parseInt(skin.left);
temp-=overflow;
if(nav || iex) skin.left=temp;
if(n_6)skin.left=temp+"px";
}
// left
if(parseInt(skin.left)<1)
{
overflow=parseInt(skin.left)-1;
temp=parseInt(skin.left);
temp-=overflow;
if(nav || iex) skin.left=temp;
if(n_6)skin.left=temp+"px";
}
}
// write content & display
function popup(msg,bak)
{
var content=msg;
if(old)
{
alert(msg);
return;
}
yyy=Yoffset;
skin.width=popwidth;
if(nav)
{
skin.document.open();
skin.document.write(content);
skin.document.close();
skin.visibility="visible";
}
if(iex)
{
pup.innerHTML=content;
skin.visibility="visible";
}
if(n_6)
{
document.getElementById("pup").innerHTML=content;
skin.visibility="visible";
}
}
// park content box
function kill()
{
if(!old)
{
yyy=-1000;
skin.visibility="hidden";
skin.width=0;
}
}
//-->
</script>
</body>
</html>
Any help,hints is appreciated
Thanx
Sreenath
My task is that when i do a mouse down on any link in html page and drag it , a copy of the text should move along with the mouse pointer.I have partially achieved this task by using the code below, the code below creates a tool tip i have modified it to suite my needs .The problem is that when i drag the all other text in the page starts getting selected (Default behavior :D ) is there any way to stop that selection or flickering effect :rolleyes:
<html>
<head>
<STYLE>
<!--
#pup {position:absolute; visibility:hidden; z-index:20; width:26; cursor:hand}
.drag{position:absolute;cursor:hand}
-->
</STYLE>
</head>
<body>
<br>
<br>
<div class="drag" id="d1" style="width:100%; text-align:left">
<h1 onmousedown="po()" onClick="kill()" onfocus="this.blur()" >NO LINK, JUST HOVER!</h1></div>
<br>
<div class ="drag" id="d2" style="width:100%; text-align:left">
<h1 onmousedown="po()" onClick="kill()" >sree</h1></div>
<!--
######################################################
# JAVASCRIPT POPUPS ROUTINE VERSION #7 07-Feb-2001 #
# Written by Mike McGrath [mike_mcgrath@lineone.net] #
# PC-Tested for Netscape 3.04, 4.61, 6.0, & IE5.5 #
# Note: Popups may not cover all form field inputs. #
# PLEASE RETAIN THIS NOTICE WHEN COPYING MY SCRIPT. #
# THIS SCRIPT IS COPYRIGHT OF MIKE MCGRATH 1998-2001 #
######################################################
-->
<script type="text/javascript">
<!-- Original: Mike McGrath (mike_mcgrath@lineone.net) -->
<!-- Web Site: http://website.lineone.net/~mike_mcgrath -->
<!--
var Xoffset=-100; // modify these values to ...
var Yoffset= -20; // change the popup position.
var popwidth=200; // popup width
var bcolor="darkgray"; // popup border color
var fcolor="black"; // popup font color
var fface="verdana"; // popup font face
// create content box
document.write("<DIV ID='pup'></DIV>");
// id browsers
var iex=(document.all);
var nav=(document.layers);
var old=(navigator.appName=="Netscape" && !document.layers && !document.getElementById);
var n_6=(window.sidebar);
// assign object
var skin;
if(nav) skin=document.pup;
if(iex) skin=pup.style;
if(n_6) skin=document.getElementById("pup").style;
// park modifier
var yyy=-1000;
// capture pointer
if(nav)document.captureEvents(Event.MOUSEDOWN);
if(n_6) document.addEventListener("mousemove",get_mouse,true);
if(nav||iex)document.onmousemove=get_mouse;
document.onmousedown=get_mouse;
document.onmouseup=kill
document.onmousemove=get_mouse;
// set dynamic coords
function po(){
popup(event.srcElement.innerText,'#FFFFFF');
}
function get_mouse(e)
{
if(event.button==1){
var x,y;
if(nav || n_6) x=e.pageX;
if(iex) x=event.x+document.body.scrollLeft;
if(nav || n_6) y=e.pageY;
if(iex)
{
y=event.y;
if(navigator.appVersion.indexOf("MSIE 4")==-1)
y+=document.body.scrollTop;
}
if(iex || nav)
{
skin.top=y+yyy;
skin.left=x+Xoffset;
}
if(n_6)
{
skin.top=(y+yyy)+"px";
skin.left=x+Xoffset+"px";
}
nudge(x);
}
}
// avoid edge overflow
function nudge(x)
{
var extreme,overflow,temp;
// right
if(iex) extreme=(document.body.clientWidth-popwidth);
if(n_6 || nav) extreme=(window.innerWidth-popwidth);
if(parseInt(skin.left)>extreme)
{
overflow=parseInt(skin.left)-extreme;
temp=parseInt(skin.left);
temp-=overflow;
if(nav || iex) skin.left=temp;
if(n_6)skin.left=temp+"px";
}
// left
if(parseInt(skin.left)<1)
{
overflow=parseInt(skin.left)-1;
temp=parseInt(skin.left);
temp-=overflow;
if(nav || iex) skin.left=temp;
if(n_6)skin.left=temp+"px";
}
}
// write content & display
function popup(msg,bak)
{
var content=msg;
if(old)
{
alert(msg);
return;
}
yyy=Yoffset;
skin.width=popwidth;
if(nav)
{
skin.document.open();
skin.document.write(content);
skin.document.close();
skin.visibility="visible";
}
if(iex)
{
pup.innerHTML=content;
skin.visibility="visible";
}
if(n_6)
{
document.getElementById("pup").innerHTML=content;
skin.visibility="visible";
}
}
// park content box
function kill()
{
if(!old)
{
yyy=-1000;
skin.visibility="hidden";
skin.width=0;
}
}
//-->
</script>
</body>
</html>
Any help,hints is appreciated
Thanx
Sreenath