Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to stop flickering effect while dragging?

    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 ) is there any way to stop that selection or flickering effect



    Code:
    <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

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    IE-only.
    Code:
    document.write('<div id="pup" onselectstart="return false"></div>');
    You seem to code it cross-browser but it only runs in IE. That is because you use innerText and event.button.

    Code:
    function get_mouse(e)
    {
       if (!e){
          e = event;
          var but = event.button;
      }
      else {
         var but = e.which;
      }
      
      if(but==1){
        ...
    }


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •