Go homepage(回首页)
Upload pictures (上传图片)
Write articles (发文字帖)

The author:(作者)归海一刀
published in(发表于) 2014/1/30 1:19:20
ASP.NET从零起步设计网站全过程(8)_[Asp.Net教程]

ASP.NET从零起步设计网站全过程(8)_[Asp.Net教程]











  第七个任务:使用Javascript完成当前日期和广告滚动窗口并填充首页面内容





  小问号蒋老师,在美工老师的指导下,我已经完成了网站首页面的设计、切割、布局等操作,还建立的Dreamweaver站点,制作好了静态的Index.html页面!
  蒋老师好,不错,刘燕经理多次向我反映说你学习的很快!
  小问号这多亏了老师们的指导,我从来没有接触过美工方面的工作,要不是你们的帮忙,我做出来的首页不知道会难看成什么样呢,拿来辟邪估计效果很好。
  蒋老师这和你自己的努力也是分不开的,继续努力。  
  小问号知道了蒋老师,这几天我一直在做美工方面的东西,好几天没有做代码了。
  蒋老师从今天开始,你就要做回你的“老本行”了。
  小问号哦也!……好的,蒋老师!




☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆




1、使用Javascript完成当前日期显示




  从现在开始,我们就开始做“动态”的东西了!先做一个动态的日期显示。
  用Dreamweaver打开index.html页面,找到放置日期的这一行,设置这一行水平对齐为“左对齐”,垂直对齐为“居中”,然后切换到代码视图,在这一行的中间插入下面的代码:




  如下图:

  好的,完成了!
  对,就这么简单!




2、使用Javascript完成自动切换图片




  如果上一个功能你形容为惊人的话,那么这个功能你可以形容为神奇!这项功能只有大型门户网站中才会拥有,而你现在就要学到。
  在开始做之前我们有一项准备工作,这项功能需要用到图片和一个“高手”写好的js文件,需要把这两项拷贝到你网站中的images文件夹中
  好,下面开始制作这项惊人的功能,我们先找到存放轮换动画的区域,将“index_blank_13.gif”这张图片删除掉,然后切换到代码视图,在中间输入如下代码:







如下图:

  接下来保存一下,现在你运行一下页面试试看吧!
  哈哈,是不是感觉特别惊人?对,就这么简单就做好了!
  提示:如果你需要更换显示的图片、文本、链接只需要在“imgUrl[1]=’images/1.JPG’; imgtext[1]=’中原市严把第二次土地调查外业质量关’; imgLink[1]=’#’;”处更换就行了。
  好了,到此轮换动画就做好了,是不是非常有成就感呢?

3、填充主页面所有内容
  OK,到现在我们的主页面所有的准备工作都已完成了,接下来我们将首页面中的内容手工加入,最终形成一个带“真实”内容的静态首页,以便我们稍后根据页面内容的布局来加入程序。这一步在这里就不详细介绍了,由大家参照我们的例子自己完成。在填充内容时有几项需要交代的,如下:












  1、下载3张必要图片(箭头和细线):























这三张图片是做首页内容时用到的箭头和细线,下载后先解压,然后将里面的三张图片拷贝到网站根目录的images文件夹中即可。
  2、首页中间“中原美景”不间断滚动图片的制作:将images/index_blank_26.gif图片删除掉,切换到代码视图插入如下代码即可:








  3、“网址导航”、“网站调查”这两部分先用dreamweaver做成静态的就行了,可以直接拷贝例子,方便稍后填充代码。
  到此首页面内容已经填充完毕了,大家可以完全按照例子来做也可以根据实际情况自由设置内容的文字大小、样式、行高等。
















If you have any requirements, please contact webmaster。(如果有什么要求,请联系站长)





QQ:154298438
QQ:417480759