yongping wanID：wanyongping
共1720次访问，排名2万外好友0人，关注者4人
,
wanyongping的文章
原创 2 篇
翻译 0 篇
转载 0 篇
评论 1 篇
最近评论
EdisonGG：看不到啊，大哥，拜托，以后别看见代码就往自己博客上贴，先试试啊
文章分类
    收藏
      相册
      存档
      软件项目交易
      订阅我的博客
      XML聚合  FeedSky
      订阅到鲜果
      订阅到Google
      订阅到抓虾
      订阅到BlogLines
      订阅到Yahoo
      订阅到GouGou
      订阅到飞鸽
      订阅到Rojo
      订阅到newsgator
      订阅到netvibes

      原创 类似Google Calendar效果的简单实现收藏

       | 旧一篇: SqlServer中取日期问题

      2007/11/02

      目前只是简单的实现了行选择的效果。

      后面的功能也是利用DIV来实现的并结合Ajax方法将登陆的数据保存到数据库中。

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
      "http://www.w3.org/TR/html4/loose.dtd"      >
      <html>
      <head>
      <title>Calender Event Page</title>
      <meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
      <script language="javascript">
      var divCount = 0;
      var drawFlag = false;
      var initPointY = 20;
      function drawTdPanel(){
                var pointX, pointY;
                var iHeight;
          pointY       = event.y;
                if (pointY < 20) return ;
                if ((pointY / 20) > 0){
              iHeight       = pointY -initPointY;
              iHeight       = (Math.floor(iHeight / 20)*20);
              divCount       = divCount + 1;
                    var objDiv = document.createElement("Div");
              objDiv.id       = "EventPanel" + divCount;
              objDiv.style.position       = "absolute";
              objDiv.style.top       = initPointY + "px";        
              objDiv.style.background       = "#9999CC";
              objDiv.style.zindex       = "3";
              objDiv.style.width       = "85%";
              objDiv.style.height       = iHeight + "px";
              
                    var objDivPanel = document.getElementById("divPanel");
              objDivPanel.appendChild(objDiv);
          }
      }

      function DrawDivOnMouseDown(){
                if (event.y < 20) return ;
          
          drawFlag       = true;
          initPointY       = event.y ;
          initPointY       = (Math.floor((initPointY) / 20) - 1) * 20;
          drawTdPanel();
      }


      function DrawDivOnMouseMove(){
          window.status       = "X:" + event.x + ",Y:" + event.y;
                if (drawFlag == true){
                    var objDivPanel = document.getElementById("divPanel");
              objDivPanel.innerHTML       = "";
              drawTdPanel();
          }
      }

      function DrawDivOnMouseUp(){
          drawFlag       = false;
      }

      function drawEventPanel(){
      }
      </script>
      </head>

      <body>
      <div id="divPanel"  onMouseDown="DrawDivOnMouseDown();" onMouseMove="DrawDivOnMouseMove();" onMouseUp="DrawDivOnMouseUp();" style="position:absolute; filter:alpha(opacity=80); border:1px solid #FF0000; background-color:#FFFFCC; z-index:2; width:85%; height:300px; left:111px; top: 16px;" >
          
      </div>
      <div style="top:20px;border:1px solid #FF0033; ">
      <table id="CalenderEventTable" width="100%" border="1" cellpadding="0" cellspacing="0">
              <tr>
                <td width="10%" rowspan="2" align="center" valign="top">00:00</td>
                <td width="90%">&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td rowspan="2" align="center" valign="top">01:00</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td rowspan="2" align="center" valign="top">02:00</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td rowspan="2" align="center" valign="top">03:00</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td rowspan="2" align="center" valign="top">04:00</td>
                <td>&nbsp;</td>
              </tr>
              <tr>
                <td>&nbsp;</td>
              </tr>
      </table>
      </div>
      </body>
      </html>
       

      发表于 @ 2007年11月02日 11:22:00|评论(loading...)|编辑

       | 旧一篇: SqlServer中取日期问题

      评论

      #EdisonGG 发表于2007-11-05 16:57:23  IP: 221.221.243.*
      看不到啊，大哥，拜托，以后别看见代码就往自己博客上贴，先试试啊
      发表评论  


      当前用户设置只有注册用户才能发表评论。如果你没有登录，请点击登录
      Csdn Blog version 3.1a
      Copyright © wanyongping