Rol: Links gehen im NN nicht mehr anzuklicken

SELF-Forum

Links gehen im NN nicht mehr anzuklicken

Rol
– Informationen zu den Bewertungsregeln

Hi,

nachdem ich eine "Drag & Drop" Funktion eingebaut habe, funktionieren meine Links im NN nicht mehr.
Liegt wohl daran, daß ich 'onmousedown' für 'startDrag' verwende.
Kann mir bitte jemad einen Tipp geben, wie ich das anders machen könnte.
Danke und sorry, daß ich ständig mit dieser DHTML Geschichte nerve.

http://www.floridee.de/Schieberegler_horizontal_NN2.htm

Der Code:
<html>

<head>
<title>Test</title>
<SCRIPT language=JavaScript type=text/javascript>
<!--
 var position;
 var xBg;
 var yBg;

function init()
 {
  xBg = findPos(document.sliderBg).xPos;
  yBg = findPos(document.sliderBg).yPos;
  NN= document.layers ? true : false;
  IE= document.all ? true : false;
  if (NN)
  {
   document.layers[0].left = xBg+110;
   document.layers[0].top = yBg+10;
   document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
  }
  if (IE)
  {
   document.all.slider.style.left = xBg+110;
   document.all.slider.style.top = yBg+10;
  }
  document.onmousedown = startDrag;
  document.onmouseup = endDrag;
 }

function startDrag(e)
 {
  var found = false;
  if (NN)
  {
   var gefunden = 0;
   var obj = document.layers[0];
   if ((e.pageX > obj.left) && (e.pageX < obj.left + obj.clip.width) && (e.pageY > obj.top) && (e.pageY < obj.top + obj.clip.height))  gefunden = true;
   if (gefunden)
   {
  current = document.layers[0];
  dx = e.pageX - current.left;
 document.captureEvents(Event.MOUSEMOVE);
 document.onmousemove = drag;
 return false;
   }
  }
  if (IE)
  {
   var obj = window.event.srcElement;
   if (obj.parentElement.id.indexOf("slider") != -1)
   {
    current = obj.parentElement.style;
    dx = window.event.clientX - current.pixelLeft;
    document.onmousemove = drag;
    return false;
   }
  }
  current = null;
  return false;
 }

function drag(e)
 {
  if (current != null)
  {
   var max = 217 + xBg;
   var min = 5 + xBg;
   if (NN)
   {
  current.left = e.pageX - dx;
 if (current.left<min) current.left=min;
 if (current.left>max) current.left=max;
 var position=Math.round((current.left-min)/((max-min)/12));
    document.form1.test.value = position;
   }
   if (IE)
   {
  current.pixelLeft = window.event.clientX - dx;
 if (current.pixelLeft<min) current.pixelLeft=min;
 if (current.pixelLeft>max) current.pixelLeft=max;
 var position=Math.round((current.pixelLeft-min)/((max-min)/12));
    document.form1.test.value = position;
   }
  }
  return false;
 }

function endDrag(e)
 {
  if (NN) document.releaseEvents(Event.MOUSEMOVE);
  document.onmousemove = null;
  current = null;
  return false;
 }

function findPos(el)
 {
  var xPos    = 0;
  var yPos    = 0;
  if(document.layers)
  {
   xPos = el.x;
   yPos = el.y;
  }else
  {
   while(el)
   {
    xPos += el.offsetLeft;
    yPos += el.offsetTop;
    el   =  el.offsetParent;
   }
  }
 return {xPos: xPos, yPos: yPos};
}

// -->
 </script>
</head>

<body onload="init()">
<div id="slider" style="POSITION: absolute;">
 <layer>
  <img border="0" src="images/reiterlein/regler2.gif" width="30" height="25">
 </layer>
</div>

<table border="1" cellpadding="0" cellspacing="0" width="250">
 <tr>
  <td align="center">
   <p><a href="http://www.teamone.de/selfaktuell/forum/">link</a></p>
  </td>
 </tr>
 <tr>
  <td align="center">
   <p><form name="form1"><input type="text" name="test" size="10"></form></p>
  </td>
 </tr>
 <tr>
  <td align="center">
   <p><img border="0" src="images/reiterlein/regler1.gif" name="sliderBg" width="250" height="40"></p>
  </td>
 </tr>
</table>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Links gehen im NN nicht mehr anzuklicken

    Joachim
    – Informationen zu den Bewertungsregeln

    hi,

    schau Dir folgenden test mal an, beachte insbesondere:
    'if(document.layers) routeEvent(e)', was den abgefangenen event
    weiterleitet.
    Beachte auch, dass hier die Eventregistrierung explizit
    fuer das div vorgenommen wird.

    hth

    Gruesse  Joachim

    <html>
    <head>

    <style type="text/css">
    <!--
    #ebene0  {position:absolute; top:100px; left:100px; width:100px; height:100px; visibility:visible;}
    #ebene2  {position:absolute; top:200px; left:100px; width:100px; height:100px; visibility:visible;}
    -->
    </style>

    <script language="javascript1.2">
    <!--
    function myEl(e){
     document.feld.ausgabe.value = this.id;
     if(document.layers) routeEvent(e);
    }

    function init(){
     if(document.layers) {
      document.ebene0.captureEvents(Event.MOUSEDOWN);
      document.ebene0.onmousedown;        = myEl;
      document.ebene2.captureEvents(Event.MOUSEDOWN);
      document.ebene2.onmousedown;        = myEl;
     }
     else if(document.all){
      document.all.ebene0.onmousedown;      = myEl;
      document.all.ebene2.onmousedown;      = myEl;
     }
     else if(document.documentElement) {
      document.getElementById('ebene0').onmousedown;   = myEl;
      document.getElementById('ebene2').onmousedown;   = myEl;
     }
    }
    //-->
    </script>

    </head>

    <body onload="init()">
     <form Name="feld"><input type="text" name="ausgabe" size="30"></form>
     <div id="ebene0">Test1</div>
     <div id="ebene2">Test2</div>
     <a href="javascript:void(alert('jep'))">Link</a>
    </body>
    </html>

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. ups, fehler

      Joachim
      – Informationen zu den Bewertungsregeln

      ups,

      da waren ein paar semikolons zuviel, so besser

      <html>
      <head>

      <style type="text/css">
      <!--
      #ebene0  {position:absolute; top:100px; left:100px; width:100px; height:100px; visibility:visible;}
      #ebene2  {position:absolute; top:200px; left:100px; width:100px; height:100px; visibility:visible;}
      -->
      </style>

      <script language="javascript1.2">
      <!--
      function myEl(e){
      document.feld.ausgabe.value = this.id;
      if(document.layers) routeEvent(e);
      }

      function init(){
      if(document.layers) {
        document.ebene0.captureEvents(Event.MOUSEDOWN);
        document.ebene0.onmousedown        = myEl;
        document.ebene2.captureEvents(Event.MOUSEDOWN);
        document.ebene2.onmousedown        = myEl;
      }
      else if(document.all){
        document.all.ebene0.onmousedown      = myEl;
        document.all.ebene2.onmousedown      = myEl;
      }
      else if(document.documentElement) {
        document.getElementById('ebene0').onmousedown   = myEl;
        document.getElementById('ebene2').onmousedown   = myEl;
      }
      }
      //-->
      </script>

      </head>

      <body onload="init()">
      <form Name="feld"><input type="text" name="ausgabe" size="30"></form>
      <div id="ebene0">Test1</div>
      <div id="ebene2">Test2</div>
      <a href="javascript:void(alert('jep'))">Link</a>
      </body>
      </html>

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. arrgs...letzter Versuch

        Joachim
        – Informationen zu den Bewertungsregeln

        alo nochmal, nicht als Zitat....

        <html>
        <head>

        <style type="text/css">
        <!--
        #ebene0  {position:absolute; top:100px; left:100px; width:100px; height:100px; visibility:visible;}
        #ebene2  {position:absolute; top:200px; left:100px; width:100px; height:100px; visibility:visible;}
        -->
        </style>

        <script language="javascript1.2">
        <!--
        function myEl(e){
         document.feld.ausgabe.value = this.id
         if(document.layers) routeEvent(e)
        }

        function init(){
         if(document.layers) {
          document.ebene0.captureEvents(Event.MOUSEDOWN);
          document.ebene0.onmousedown        = myEl;
          document.ebene2.captureEvents(Event.MOUSEDOWN);
          document.ebene2.onmousedown        = myEl;
         }
         else if(document.all){
          document.all.ebene0.onmousedown       = myEl;
          document.all.ebene2.onmousedown       = myEl;
         }
         else if(document.documentElement) {
          document.getElementById('ebene0').onmousedown   = myEl;
          document.getElementById('ebene2').onmousedown   = myEl;
         }
        }
        //-->
        </script>

        </head>

        <body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" onload="init()">
         <form Name="feld"><input type="text" name="ausgabe" size="30"></form>
         <div id="ebene0">Test1</div>
         <div id="ebene2">Test2</div>
         <a href="javascript:void(alert('jep'))">Link</a>
        </body>
        </html>

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. arrgs...letzter Versuch

          Rol
          – Informationen zu den Bewertungsregeln

          Es funktioniert.

          Danke!!!!!!!!

          Viele Grüße
          Rol

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln