用HTML和JS制作一个照片随机抽奖的小程序。
1、 在电脑任意位置(如桌面)新建文件夹,命名为抽奖(名称不限)。
2、 打开文件夹,接着创建以下几个文件。

3、 在文件空白处右键新建文件夹,命名为photo。放入小学、初中或高中同学照片,照片以同学名字命名,格式为.jpg。
4、 返回抽奖文件夹,用PS制作一张背景图(参考相关经验),保存到该文件夹,命名为background.JPG。
5、 {
6、 }
7、 {
8、 }
9、 {
10、 }
11、 {
12、 如果输入框的值为开始
13、 按钮标题已改为停。
14、 按钮文字已设置为开始。
15、 如果按钮标题是开始
16、 {
17、 {
18、 }
19、 {
20、 }
21、 }
22、 如果按钮标题是停
23、 {
24、 {
25、 }
26、 }
27、 抽奖活动标题
28、 选项价值为1,表示一等奖。
29、 获得二等奖选项,价值设定为2。
30、 选择价值为3的选项,表示获得三等奖。
31、 点击按钮即可展示名称。通过触发onclick事件,调用funDisplayName函数,实现名字的显示功能。用户交互简单直接,提升体验感。
32、 至此,文件创建完成,效果所示。
33、 双击抽奖.htm,若默认浏览器为IE,可能弹出所示提示,请点击,其他浏览器通常无此问题。
34、 弹出窗口后点击,即可看到红色图示。



35、 点击开始,照片自动切换,再点停,让同学们猜这是谁,最后点击显示名字。

36、 在cj.js中调整照片跳转频率,所示位置。100代表0.1秒切换一次,可自行设置数值,保存后刷新页面即可生效。