Hi ,
I have the requirement like this
1) It should be in javascript and html datagrid only
2) In html-datagrid table ...mouseover on cell(coloumn) pop-up should be appear
3) It should be come out from the browser(pop-up)
4) It shoulb be use Javascript only

<html>
<head>
<title>pop-up</title>

<style type="text/css">

      .popup {
        border:#333;
        font-family: Tahoma;
        font-size: 12px;
        display: none;
        position: absolute;
        z-index: 60;
      }

      .popuptitle {
        position: relative;
        background: blue;
        color: white;
        font-weight: bold;
        height: 10px;
        padding: 5px;
        visibility:hidden;
      }

      .popuptitle input {
        position: absolute;
        font-size: 75%;
        right: 2px;
        top: 2px;
      }

      .popupbody {
        background: #ddd;
        padding: 5px;
        text-align: center;
              }

      #popup1 { top: 100px; left: 50px; width: 500px;}
      #popup1 iframe { width: 305px; height: 204px;}


    </style>

    <script type="text/javascript">

      function popupWindow(o,u)
      {
        // o - Object to display.
        // u - URL to display, null = hide popup.

        var obj = document.getElementById(o);

        if(u)
        {
          obj.style.display = 'block';
           window.open(u,o);         
        }
        else
          obj.style.display = 'none';
      }

    </script>
<script type="text/javascript">
<!--
function popup11(url) 
{
 var width  = 305;
 var height = 205;
 var left   = 150;
 var top    = 100;

 var params = 'width='+width+', height='+height;
 params += ', top='+top+', left='+left;
 params += ', directories=no';
 params += ', location=no';
 params += ', menubar=no';
 params += ', resizable=no';
 params += ', scrollbars=no';
 params += ', statusbar=no';
 params += ', toolbar=no';
 params += ', addressbars =no';
 params += ', menubar=no';
 params += ', display=no';
 params += ', iframes=no';

 newwin=window.open(url,'windowname5', params);
 if (window.focus) {newwin.focus()}
 return false;
}
// -->
</script>
</head>
<body>
<div>
<input type="button"  value="Centered popup window"  "javascript: void(0)" 
   onclick="popup11('C:/Users/ravi/Desktop/image.html')">

   <div id="popup1" class="popup">

      <iframe name="popup1" class="popupbody"></iframe>
   </div>  



     <h1>Popup Style Window Using Elements</h1>

    <input type="button"  value="Click For POP-Up"  onClick="popupWindow('popup1','C:/Users/ravi/Desktop/image.html') ;"/>

    </div>
    </body>
</html>

Edited 3 Years Ago by Reverend Jim: Fixed formatting

This article has been dead for over six months. Start a new discussion instead.