时间轴可以用来记录你的点点滴滴,能让你回看到“那年今日”;那么用代码写一个这样的时间轴需要多久的时间?或者为你自己,你的家人,留下一份可以保存在服务器上的时光的记忆!
有没有很清楚的发现这里面都需要什么?图片好说,自己可以替换,jQuery可以在网上下载的,主要就是那个CSS和html得自己写。这个写着快,用div负责内容,还有用JS“获取”当前系统时间,并显示出来;检测你要发的内容是否为“空”!
这次直接上来JavaScript的部分,不多但很长。注意圈起来的部分!上面那部分是判断文本框的,下面那个圈起来的是负责获取系统时间并显示的。
然后准备几个div,因为你需要在接下来的CSS中去设置这些div 的属性。这边不细数他有几个div,就说一下需要哪部分;
①文本框的头部;②文本框 ③发布按钮 ④时间轴的那条线 ⑤发布完成后的文本框显示。
这样下来基本上时间轴的所有要显示的东西都出来了;不过接下来咱还需要给它做个”拼接和美化”手术,比如动动他的位置,改改它的大小,CSS这块的话主要就是看个人感觉,怎么好看怎么来!
我天,现在才发现我写了好多好多的CSS(带上空行的有137行),中间那个分割线主要是为了分开这两个部分;能让自己的CSS代码清晰一点。或许把代码写好是一件值得你一生追求的事。