Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <link href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
        <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
        <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
</head>
<body>
  <div id="maindiv" style='margin:0 auto; width:100%;'>
    <div id="d2" style="display: none; float:left; width:500px;"> 
      <img src="http://www.infosys.com/SiteCollectionImages/cloud-ecosystem-hub-mm.jpg" title=" Image of Tic tac toe small image" />
    </div>
    <div id="d1" style='float:left; width:500px;'>
      Tic Tac Toe(This should hide on mouse over this div)
    </div>
            
             <div id="d3" style="display: none; float:left; width:500px;">
                 <table width="80px" height="26px" border="1">
                     <tr>
                          <td width="200px"> Information/description about tic tac toe in small para. blah blah blah  </td>
                     </tr>
                 </table>
             </div>
  </div>
</body>
</html>
 
       $(document).ready(function(){
          $("#maindiv").mouseover(function()
          {
            //$("#d1").hide();
             $("#d2").show();
              $("#d3").show();
          }).mouseout(function()
          {
            //$("#d1").show();
             $("#d2").hide();
              $("#d3").hide();
          });
        });
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers