Всплывающее/панель не отображается в правильном положении через javascript

Я создал страницу, на которой показан список участников. Я создал функцию Javascript, которая показывает детали пользователя на панели с идентификатором divpreview с position:absolute и z-index:100 всплывающее окно, но я не могу показать его прямо над участником.Всплывающее/панель не отображается в правильном положении через javascript

<div runat="server" id="divpreview" class="preview"> 
    </div> 

    <script type="text/javascript" language="javascript"> 
     function showdiv(id, m, pos) { 

      var arr = new Array(7); 
      arr = id.split("###"); 
      var divhtml = ""; 
      divhtml += "<table border='1' style='background-color:#1C5E55;color:white;absolute' cellpadding='3' cellspacing='0'><tr><td>Sponsor Id</td><td>" + arr[0] + "</td></tr>"; 
      divhtml += "<tr><td>Total Left Point</td><td>" + arr[1] + "</td></tr>"; 
      divhtml += "<tr><td>Total Right Point</td><td>" + arr[2] + "</td></tr>"; 
      divhtml += "<tr><td>Total Left Investment</td><td>" + arr[3] + "</td></tr>"; 
      divhtml += "<tr><td>Total Right Investment</td><td>" + arr[4] + "</td></tr>"; 
      divhtml += "<tr><td>Self Point </td><td>" + arr[5] + "</td></tr>"; 
      divhtml += "<tr><td>Expiry Date</td><td>" + arr[6] + "</td></tr>"; 

      divhtml += "</table>"; 
      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").innerHTML = divhtml; 
      var left = m.clientX + 10; 
      if (pos == 1) { 
       left = m.clientX - 230; 
      } 
      else { 
       left = m.clientX + 10; 
      } 
      debugger; 

      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.left = left.toString() + 'px'; 
      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.display = "block"; 
      var top = 0; 
      top = document.documentElement.scrollTop + m.clientY - 50; 
      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.top = top.toString() + 'px'; 
     } 
     function hidediv() { 
      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.display = "none"; 
     } 
     function movediv(m, pos) { 
      var left = m.clientX + 05; 
      if (pos == 1) { 
       left = m.clientX - 200; 
      } 
      else { 
       left = m.clientX + 10; 
      } 

      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.left = left.toString() + 'px'; 
      var top = 0; 
      top = document.documentElement.scrollTop + m.clientY - 50; 
      document.getElementById("ctl00_ContentPlaceHolder1_divpreview").style.top = top.toString() + 'px'; 
     } 
    </script>

Я хочу, чтобы панель появляться рядом звезд. Что мне делать.

источник

2017-01-30 rexroxm

использовать этот стиль на divpreview

<div runat="server" id="divpreview" class="preview" style="position:absolute;z-index:999;"> 
</div>

источник

2017-01-30 09:16:17 Naveen

Это работает, спасибо – rexroxm

Использование

position: relative;

к родительским делам. Абсолютный элемент позиции будет «останавливаться» при поиске ближайшего позиционного относительного или позиционированного абсолютного элемента.

источник

2017-01-30 09:11:30 kiwi1342

Я пробовал, но не работает, панель занимает место на странице. Я хочу, чтобы он отображался над страницей, как всплывающее окно. – rexroxm

Вы хотите его посередине страницы над всем? не могли бы вы предоставить нам скрипку? – kiwi1342

, который фиксировал положение в середине страницы. Я хочу, чтобы он появился прямо рядом с звездой. – rexroxm

position: absolute;

родительского DIV Позиция 'абсолюта'.

источник

2017-01-30 09:22:01

Всплывающее/панель не отображается в правильном положении через javascript

ответ

Смежные вопросы