您现在的位置: 天极网 > 软件频道 > 设计在线 > 网页UI设计 > DHTML制作有日期选择的文本框(一)
全文

DHTML制作有日期选择的文本框(一)

2000-10-11 00:00作者:耗子出处:yesky责任编辑:
 ∠嘈糯蠹叶技齏indows98的文件查找对话框吧。你可以通过设置文件的修改日期的范围来查找相关文件。大家一定记得那个可以选择日期的单行编辑器吧。现在,让我们把这个功能实现到网页的表单中的文本框上。这样,我们输入日期的时候就会很简单了。
  制作这个日期选择功能的文本框时,我们的思路是先制作一个下拉式菜单。如果大家看过我的《DIV下拉式菜单》的文章,大家一定这个菜单要用DIV来制作了。当然要作这样一个菜单是很简单的事。但在这里我把它优化了一下,在下拉的这个菜单页,它会跟随着整个浏览器的窗口发生变化,也就是说,我们不会发现菜单页和窗口边缘重叠的情况,它会随整个窗口的大小改变自己的尺寸。
  还是让我们来看一下示例吧,在下面这个示例中,你可以试着改变一下浏览器窗口的大小,然后再让菜单显示出来。
效果演示

  于是我们要得到那个小图片的在页面上的位置,然后再根据这个位置显示菜单。在Netscape中要得这个图片的位置是比较麻烦的事,不过在这里我还是解决了这个问题。先我们看看JavaScripts的代码及简要说明:

  这里,我把代码分成了两部分,第一部分是核心,第二部分主要是用来调用第一部分中的函数的。相信聪明的你一定会很容易看懂这两段代码。

  在那个图片上,我们用这样的HTML语句进行描述:

$#@60;IMG align=absMiddle alt="click me!" border=0 height=13 width=13 id=mookiePos name=mookiePos onmouseup="toggleVisible("mookie")" src="arrowicon.gif" $#@62;

  这里我们还要定义一个DIV(层):

$#@60;DIV id=mookie style="POSITION: absolute"$#@62;
$#@60;TABLE border=1 cellPadding=2 cellSpacing=0$#@62;
$#@60;TR$#@62;
$#@60;TD bgColor=#ffffff$#@62;$#@60;A href="javascript:hideElement("mookie")"$#@62;X$#@60;/A$#@62; $#@60;——单击关闭$#@60;BR$#@62;
欢迎访问我的主页:$#@60;br$#@62;
$#@60;a href="http://haoel.yeah.net/"$#@62;http://haoel.yeah.net/$#@60;/a$#@62; $#@60;/TD$#@62;
$#@60;/TR$#@62;$#@60;/TABLE$#@62;$#@60;/DIV$#@62;

  看到这里,大家可能不明白了,这些和日历有什么样的关系。当然有关系啦,我们在? 的这个菜单中放上日历不就行啦。这里我讲的是一个基础上的编制。
共1页。 1
相关搜索:
相关文章及软件
热门关注
特别推荐
网友关注
软件下载
娱乐下载
驱动下载
热评排行
群乐关注结束-->
文章排行
本周
本月
最近更新
关于我们|网站律师|天极服务|电子杂志|RSS订阅|加入我们|网站地图
TMG
Copyright (C) 1999-2008 Chinabyte.com, All Rights Reserved 版权所有 天极网络
商务联系、网站内容、合作建议:010-82657868
版权声明 在线提交意见反馈 Powered by 天极内容管理平台CMS4i
经营性网站备案信息 网警备案 中国网站排名
天极传媒:天极网|比特网|IT专家网|IT商网|52PK游戏网|IT分众