11.20第二次授课作业——音乐网站（界面）

11.20第二次授课作业——音乐网站（界面）

一、主要框架index

使用了几个的div。首先用一个div body框住所有要布局的div，同时做到在页面上居中的效果。
使用float以让内部的div有序且紧凑地排列。

二、侧边栏

通过表格单元格的形式制作了各个侧边栏。利用onmouseover达到了鼠标选中单元格的效果，并制作了一个可以点击的专辑跳转（用iframe制作了一个二级浏览器的效果）。

变灰的部分就是鼠标移动到的区域

三、iframe

这是brower div中的iframe，他在打开时以音乐主页为默认页面，在点击带有超链接的专辑文字时跳转到专辑页面，通过在此超链接中加入target= "iFrame1 "以达到部分跳转的效果

顺便在专辑页面制作了返回键

四、顶部栏

此处css使用较多，通过margin定位了各个图标和标题昵称等，在昵称下做了一个没什么用的注册页面。
设置按钮没有实际用途，但也做了一个onmouseover的效果，由于是图片，所以使用了filter滤镜来使它达到变色的效果。

搜索框比较简单，通过css把它变得顺眼了些，用绝对定位在里面放上了搜索图标

五、未实现的内容

1.播放控件

由于内含多个音乐并且audio和控件不在同一个层级中，所以应该是要用js写的。从制作好框架后就在想这个问题，但是做了各种尝试都未能达到像各种播放器中那样的效果

2.切换歌曲

目前做到了暂停播放中的歌曲并切换到另一歌曲的效果，但是代码十分繁琐并且不能清除已经进行的进度，目前基本思路是使用定时器。